@charset "utf-8";
/*
Theme Name: factory02
Theme URI: https://template.w3city.com/
Description: pcbrain
Version: 1.0
Author: pcbrain.co.jp
*/


/* YUI fonts.css - font size設定
----------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&family=Poppins:wght@600&display=swap');
@import url("css/cssfonts-min.css");

/* default style - リセット及びbody基本設定
----------------------------------------------------------- */
@import url("css/default.css");

/* all style
----------------------------------------------------------- */
@import url("css/style.css");

:root{
	--main-color01:		#1e2955;
	--main-color02:		#3f4ea8;
	--main-color03:		#6a6c71;
	--main-color04:		#343e67;
--main-color05:		#6456a5;
	--main-color06:		#cacbfc;

	--main-grd-deepdark:#1e2955;
	--main-grd-dark:	#222225;
	--main-grd-light:	#1e2955;

--color-white:		#FFFFFF;
--color-black:		#000000;
	--color-yellow:		#fdff5d;	
--color-gray70:		#555555;
--color-gray60:		#999999;
--color-gray30:		#cccccc;
--color-gray20:		#dddddd;
	--color-gray05:		#e5e5e5;
	--color-red:		#e73f3f;
--color-reddark:	#662121;	
	--color-marker-y:	var(--color-yellow);
	--color-marker-v:	#d9dcee;
}

body {
    min-width:1300px;
    font-size: 16px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	-webkit-text-size-adjust: 100% !important;
}
.inner {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

article {
    padding: 0 0 20px;
}

.btnC,
.btnR {
    margin-top:5px;
    margin-bottom:10px;
}
.btnC {
    text-align: center;
}
.btnR {
    text-align: right;
}
.btnC a,
.btnR a,
.btn a{
    display: inline-block !important;
    border-radius: 100vh;
    font-size: 16px;
    background: var(--main-grd-dark);
    background-image: linear-gradient( 90deg, var(--main-grd-dark) 0%, var(--main-grd-light) 100%);
    text-align: center;
    font-weight: 400;
    line-height: 1.2;
    padding: 15px 70px 15px 30px;
    text-decoration: none !important;
    color: var(--color-white) !important;
    margin-left: 15px;
    position: relative;
}
.btnC a::after,
.btnR a::after,
.btn a::after{
    content: '';
    position: absolute;
    bottom: calc(50% - 1px);
    right: 31px;
    width: 5px;
    height: 1px;
    background: var(--color-white);
    transform: rotate(35deg);
    transition: all .3s;
}
.btnC a::before,
.btnR a::before,
.btn a::before{
    content: '';
    position: absolute;
    bottom: calc(50% - 3px);
    right: 30px;
    width: 20px;
    height: 1px;
    background:var(--color-white);
    transition: all .3s;
}
.btnC a:hover:after,
.btnR a:hover:after,
.btn a:hover:after{
    right: 21px;
}
.btnC a:hover::before,
.btnR a:hover::before,
.btn a:hover::before{
    right: 20px;
}
.btn a:first-child,
.btnC a:first-child,
.btnR a:first-child{
    margin-left: 0;
}
.btnDetailR{
    margin-top:5px;
    margin-bottom:10px;
    text-align: right;
}
.btnDetailC{
    margin-top:5px;
    margin-bottom:10px;
    text-align: center;
}
.btnDetailR span,
.btnDetailC span,
.btnDetailC a{
    display: inline-block !important;
    border: solid 1px var(--color-black);
    border-radius: 100vh;
    font-size: 12px;
    text-align: center;
    font-weight: 400;
    line-height: 1.2;
    padding: 5px 40px 5px 15px;
    text-decoration: none !important;
    position: relative;
	color: var(--color-black) !important;
}
.btnDetailR span::after,
.btnDetailC span::after,
.btnDetailC a::after{
    content: '';
    position: absolute;
    bottom: calc(50% - 1px);
    right: 16px;
    width: 5px;
    height: 1px;
    background: var(--color-black);
    transform: rotate(35deg);
    transition: all .3s;
}
.btnDetailR span::before,
.btnDetailC span::before,
.btnDetailC a::before{
    content: '';
    position: absolute;
    bottom: calc(50% - 3px);
    right: 15px;
    width: 15px;
    height: 1px;
    background:var(--color-black);
    transition: all .3s;
}
a:hover .btnDetailR span::after,
a:hover .btnDetailC span::after,
a:hover .btnDetailC a::after{
    right: 11px;
}
a:hover .btnDetailR span::before,
a:hover .btnDetailC span::before,
a:hover .btnDetailC a::before{
    right: 10px;
}
.mkr-y{
    position: relative;
	background-image: linear-gradient( transparent 80%,var(--color-marker-y) 80%,var(--color-marker-y) 100%);
}
.tel,
#main .tel {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    color: var(--color-white);
    font-size: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.tel span.tel-link {
    font-size: 40px;
    line-height: 1;
    margin-left: 5px;
}
.tel span.tel-link a:link,
.tel span.tel-link a:visited {
    color: var(--color-white);
    text-decoration: none;
}
.tel span.tel-open {
    font-size: 16px;
    font-family:'Noto Sans JP',"メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    font-weight: 400;
}
.en{
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
}
.spblock,
.spinline,
.sptr {
    display: none;
}

/* -----------------------------------------------------------
    header
----------------------------------------------------------- */

header{
    background: linear-gradient( 90deg, var(--main-grd-light) 0%, var(--main-grd-dark) 100%);
}
#top header,
#menu header{
        padding-bottom: 100px;
}
header .inner{
    max-width: unset;
    width: auto;
	height:100px;
    display: flex;
    justify-content: space-between;
	align-items:center;
    overflow: visible;
} 
header .hdrLogo{
	line-height:1;
	padding-left:30px;
}
header .inner .boxR{
    text-align: right;
    padding: 0 130px 0 10px;
    box-sizing: border-box;
	display: flex;
    align-items: center;
}
header .inner .hdrTel{
    display: inline-block;
    border: solid 1px var(--color-color03);
    line-height: 1;
    padding: 5px 15px;
    margin: 14px 0 9px 0;
}
header .inner .hdrTel .tel{
    font-size: 20px;
}
header .inner .hdrTel .tel-link{
    font-size: 35px;
}
header .inner .hdrTel .tel-open{
    font-size: 15px;
}
header .hdrContact{
    position: fixed;
    top: 0;
    right: 0;
    z-index: 100;
}
header .hdrContact a{
    background-color: var(--main-color01);
    color: var(--color-white);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 110px;
    height: 100px;
    text-decoration: none;
    font-size: 14px;
}
@media screen and (max-width : 1300px) {
	header .hdrContact a{
    	font-size: 13px;
	}
}
header .hdrContact a i{
    display: block;
    font-size: 18px;
}
header .hdrContact ul li:nth-child(2) a{
	background-color: var(--main-color02);
}
header .hdrContact ul li:nth-child(3) a{
	background-color: var(--main-color03);
}
@media screen and (max-width : 1300px) {
	header .hdrContact ul li:nth-child(3) a{
		letter-spacing: -0.1em;
	}
}

/* -----------------------------------------------------------
    nav
----------------------------------------------------------- */

header nav #gNav {
    display: flex;
}
header nav #gNav * {
    line-height: 1.0;
}
header nav #gNav>li {
    display: block;
    padding-left: 1em;
    text-align: center;
    position: relative;
}
@media screen and (max-width : 1300px) {
	header nav #gNav>li {
		padding-left: 0.7em;
	}
}
header nav #gNav>li>a:link,
header nav #gNav>li>a:visited {
    color: var(--color-white);
    position: relative;
    display: inline-block;
    text-decoration: none;
    padding: 5px 0 0;
    height: 40px;
}
@media screen and (max-width : 1300px) {
	header nav #gNav>li>a:link,
	header nav #gNav>li>a:visited {
		font-size: 13px;
	}
}
header nav #gNav>li>a::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f107";
    position: absolute;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    color: var(--color-color03);
    opacity: 0;
}
header nav #gNav>li:hover>a::after {
    opacity: 1;
    transition: opacity 1.0s;
    transition: 0.8s;
}
header nav #gNav>li ul {
    opacity: 0;
    pointer-events: none;
    background: var(--main-grd-deepdark);
    position: absolute;
    z-index: 100;
    width: 300px;
    padding: 20px 10px 10px 30px;
    box-sizing: border-box;
    text-align: left;
}
header nav #gNav>li:hover ul {
    opacity: 1;
    transition: opacity 1.0s;
    pointer-events: auto;
}
header nav #gNav>li ul li {
    display: inline-block;
    margin: 0 1.5em 1.0em 0;
}
header nav #gNav>li ul li a:link,
header nav #gNav>li ul li a:visited {
    color: var(--color-white);
}
header nav #gNav>li ul li a:hover{
    opacity: 0.7;
    transition: 0.6s;
}
.topRequest,
.menuContact,
.menuLead{
    background: var(--color-white);
    max-width: 1200px;
    box-shadow: 0 0 7px var(--color-black);
    margin: -240px auto 0;
    position: relative;
    z-index: 10;
}
.topRequest h3,
.menuContact h3{
    font-size: 36px;
    font-weight: 500;
    background-color: var(--main-color02);
    color: var(--color-white);
    padding: 7px 100px 0 70px;
    display: inline-block;
    height: 80px;
    box-sizing: border-box;
    position: relative;
}
.topRequest h3::after,
.menuContact h3::after{
    content: '';
    width: 0;
    height: 0;
    border-top: 80px solid transparent;
    border-right: 40px solid var(--color-white);
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
}
.topRequest h4{
    color: var(--main-color02);
    display: inline-block;
    font-weight: 700;
    font-size: 30px;
    margin-left: 60px;
}
.topRequest p,
.menuContact p{
    font-size: 14px;
    margin-bottom: 15px;
}
.topRequest .formBox,
.menuContact .formBox{
    padding: 40px;
}
.topRequest .formBox table th, .topRequest .formBox table td,
.menuContact .formBox table th, .menuContact .formBox table td{
    padding: 5px 0;
    border: none;
}
.topRequest .formBox table tbody,
.menuContact .formBox table tbody{
    display: flex;
    flex-wrap: wrap;
}
.topRequest .formBox table tr,
.menuContact .formBox table tr{
    display: block;
}
.topRequest .formBox table th,
.menuContact .formBox table th{
    width: 160px;
}
.topRequest .formBox input:not(input[type="checkbox"]):not(input[type="submit"]):not(input[type="radio"]),
.topRequest .formBox select,
.topRequest .formBox textarea,
.menuContact .formBox input:not(input[type="checkbox"]):not(input[type="submit"]):not(input[type="radio"]),
.menuContact .formBox select,
.menuContact .formBox textarea{
    font-size: 15px;
    padding: 0 3px;
    height: 35px;
    width: 310px;
}
.topRequest .formBox .tr-name input,
.menuContact .formBox .tr-name input,
.menuContact .formBox .tr-menu select{
    width: 500px !important;
}
.topRequest .formBox select,
.menuContact .formBox select{
    width: 200px;
}
.topRequest .formBox .tr-position th,
.topRequest .formBox .tr-section th,
.topRequest .formBox .tr-tel th,
.menuContact .formBox .tr-position th,
.menuContact .formBox .tr-section th,
.menuContact .formBox .tr-tel th{
    width: 90px;
    text-align: right;
    padding-right: 10px;
}
.topRequest .formBox input[type="checkbox"],
.menuContact .formBox input[type="checkbox"]{
    transform: scale(1.5);
    margin: 0 6px 0 0;
}
.topRequest table,
.menuContact table{
    margin-bottom: 20px;
}
.topRequest .formBox .accept,
.menuContact .formBox .accept{
    text-align: center;
    margin-bottom: 20px;
}
.topRequest .formBox .accept > span:last-of-type,
.menuContact .formBox .accept > span:last-of-type{
    font-size: 14px;
    margin-left: 20px;
}
.topRequest .formBox .submit,
.menuContact .formBox .submit{
    text-align: center;
    margin-bottom: 0;
}

/* -----------------------------------------------------------
    footer
----------------------------------------------------------- */

footer {
  background: linear-gradient( 90deg, var(--main-grd-dark) 0%, var(--main-grd-dark) 50%, var(--main-grd-deepdark) 50%, var(--main-grd-deepdark) 100%);
  color: var(--color-white);
  font-size: 12px;
}
footer a,
footer a:link,
footer a:visited {
    color: var(--color-white);
    text-decoration: none;
}
footer .inner {
    padding: 90px 0 0 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
footer .inner .boxL,
footer .inner .ftrNav{
    width: 50%;
}
footer .inner .boxL .ftrLogo {
    margin-bottom: 20px;
    display: block;
}
footer .inner .boxL h5{
    font-size: 16px;
    margin-bottom: 5px;
}
footer .inner .boxL dl{
    display: flex;
    font-size: 14px;
}
footer .inner .boxL dt{
    width: 5em;
}
footer .inner .ftrNav{
    display: flex;
    justify-content: right;
    flex-wrap: wrap;
    gap: 40px 0;
}
footer .inner  .ftrNav ul{
    display: block;
    width: 28%;
}
footer .inner  .ftrNav ul li{
    margin-bottom: 10px;
}
footer .inner  .ftrNav ul li::before{
    content: '─';
    margin-right: 5px;
}
footer .inner  .ftrNav ul li a:hover{
    opacity: 0.7;
    transition: 0.6s;
}
footer .copyRight {
    width: 100%;
    clear: both;
    text-align: right;
    padding: 50px 0 60px 0;
}
.ftrRequest,
#main .ftrContact,
#main .ftrSeminar{
    background: var(--color-gray05);
}
#main .ftrContact,
#main .ftrSeminar{
	padding-top: 50px !important;
}
.ftrRequest p,
#main .ftrContact p,
#main .ftrSeminar p{
    margin-bottom: 15px;
}
.ftrRequest h2,
#main .ftrContact h2,
#main .ftrSeminar h2{
    font-size: 50px;
    font-weight: 500;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.ftrRequest h2 span,
#main .ftrContact h2 span,
#main .ftrSeminar h2 span{
    font-size: 16px;
    display: inline-block;
    border: solid 1px var(--color-black);
    margin-left: 15px;
    padding: 1px 10px 3px;
}
.ftrRequest .lead,
#main .ftrContact .lead,
#main .ftrSeminar .lead{
    text-align: center;
    margin-bottom: 30px;
}
.ftrRequest .requestBox{
    border: solid 1px var(--main-color01);
    background-color: var(--color-white);
    padding: 30px 80px;
}
.ftrRequest .requestBox h3{
    font-size: 20px;
    font-weight: 500;
    color: var(--main-color01);
    text-align: center;
    position: relative;
    margin-bottom: 20px;
}
.ftrRequest .requestBox h3::before,
.ftrRequest .requestBox h3::after{
  position: relative;
  display: inline-block;
  content: "";
  background: var(--main-color01);
  width: 2px;
  height: 1.1em;
  margin: 0 1em;
  margin-top: -.2em;
  vertical-align: middle;
}
.ftrRequest .requestBox h3::before {
  transform: rotate(-25deg);
}
.ftrRequest .requestBox h3::after {
  transform: rotate(25deg);
}
.ftrRequest .requestBox .imgL{
    margin-right: 50px;
}
.ftrRequest ul{
    overflow: hidden;
    margin-bottom: 0;
}
.ftrRequest ul li:before,
.ftrRequest ul li:after{
    content: none;
}
.ftrRequest ul li{
	list-style-type: disc;
	margin-left: 24px;
    padding: 0;
}
.ftrRequest .telBox,
#main .ftrContact .telBox{
    background: var(--main-color01);
    padding: 30px 80px;
    color: var(--color-white);
    text-align: center;
}
.ftrRequest .telBox p,
#main .ftrContact .telBox p{
    margin-bottom: 0;
}
.ftrRequest .telBox .btnC a{
    background-image: none;
    border: solid 1px var(--color-white);
    font-size: 14px;
}
.ftrRequest .formBox,
.ftrContact .formBox,
.ftrSeminar .formBox{
    margin-top: 45px;
    background: var(--color-white);
    padding: 60px 80px;
}
.ftrRequest table,
#main .ftrContact table,
.ftrSeminar .formBox table{
	width: 100%;
    margin-bottom: 40px;
	border-top: dotted 1px var(--color-black);
}
.ftrRequest table tr,
#main .ftrContact table tr,
.ftrSeminar .formBox table tr{
	border-bottom: dotted 1px var(--color-black);
}
#main .ftrContact table th,
#main .ftrSeminar table th{
	background-color: transparent;
}
.ftrRequest .formBox .accept,
#main .ftrContact .formBox .accept,
#main .ftrSeminar .formBox .accept{
    text-align: center;
    margin-bottom: 30px;
}
.ftrRequest .formBox .accept >span:last-of-type,
#main .ftrContact .formBox .accept >span:last-of-type,
#main .ftrSeminar .formBox .accept >span:last-of-type{
    font-size: 14px;
    margin-left: 20px;
}
.ftrRequest .formBox .submit,
#main .ftrContact .formBox .submit,
#main .ftrSeminar .formBox .submit,
#main .searchBox p.submit{
    text-align: center;
    margin-bottom: 0;
}
.ftrFaq{
    padding-bottom: 70px !important;
}
.ftrFaq h2 {
    text-align: center;
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 20px;
}
.ftrFaq h2 span.en{
    font-family: 'Poppins', sans-serif;
    font-size: 50px;
    font-weight: 600;
    margin-right: 30px;
}
.ftrFaq h2::first-letter{
    color:var(--main-color01);
}
.ftrFaq .inner{
    border-top: solid 1px var(--color-black);
    border-bottom: solid 1px var(--color-black);
    padding: 45px 110px 60px 110px;
}
.ftrFaq .faqAnswer{
    border: solid 1px var(--color-gray30);
    border-top: none;
    background-color: var(--color-gray05);
}
.ftrFaq .toggle {
    display: none;
}
.ftrFaq .title,
.ftrFaq .faqAnswer {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translateZ(0);
    transition: all 0.3s;
}
.ftrFaq .title {
    border: solid 1px var(--color-gray30);
    background-color: var(--main-color06);
    font-size: 16px;
    font-weight: 400;
    margin-top: 15px;
    padding: 10px 15px;
    display: block;
    cursor: pointer;
}
.ftrFaq .title::after,
.ftrFaq .title::before {
    content: "";
    position: absolute;
    right: 1.25em;
    top: 1.1em;
    width: 2px;
    height: 0.75em;
    background-color: var(--color-black);
    transition: all 0.3s;
}
.ftrFaq .title::after {
    transform: rotate(90deg);
}
.ftrFaq .faqAnswer {
    max-height: 0;
    overflow: hidden;
    border-bottom-width: 0px;
}
.ftrFaq .faqAnswer p {
    margin: 0;
    padding: 10px 15px;
    line-height: 1.5;
}
.ftrFaq .toggle:checked + .title + .faqAnswer {
    max-height: 500px;
    border-bottom-width: 1px;
    transition: all 1.5s;
}
.ftrFaq .toggle:checked + .title::before {
    transform: rotate(90deg) !important;
}
.ftrFlow{
background:url(./img/top/bg_flow.png) no-repeat right bottom var(--color-white);
}
.ftrFlow h2{
    font-size: 30px;
    font-weight: 500;
    text-align: center;
    color: var(--color-white);
}
.ftrFlow h2::first-letter{
    color: var(--main-color02) !important;
}
.ftrFlow h2 span.en{
    font-family: 'Poppins', sans-serif;
    font-size: 50px;
    font-weight: 600;
    margin-right: 30px;
	color: var(--color-white);
}
.ftrFlow .lead{
	margin-bottom: 40px;
    text-align: center;
    color: var(--color-white);
}
.ftrFlow ul li{
    margin-bottom: 0 !important;
    padding-bottom: 40px !important;
    background: url(./img/top/arrow_flow.png) no-repeat center bottom;
}
.ftrFlow ul li:last-child{
    background: none;
}
.ftrFlow dt{
	background: var(--color-black);
    color: var(--color-white);
    width: 400px;
    box-sizing: border-box;
    padding: 20px 20px 0 20px;
    height: 100px;

    overflow: hidden;
    position: relative;
    z-index: 5;
    line-height: 0.9;
}
.ftrFlow dt h3{
    font-size: 24px;
    font-weight: 400;
    clear: none !important;
}
.ftrFlow dt span{
    font-family: 'Poppins', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: var(--main-color06);
    margin-right: 5px;
}
.ftrFlow dt span:nth-of-type(3){
    font-size: 30px;
    color: var(--main-color06);
}
.ftrFlow dt span.ico{
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--color-white);
    float: right;
}
.ftrFlow dd{
    background:var(--color-white);
    width: 930px;
    margin-top: -80px;
    margin-right: 0;
    margin-left: auto;
    box-sizing: border-box;
    padding: 20px 20px 20px 160px;
    position: relative;
    z-index: 4;
    min-height: 100px;
    display: flex;
    align-items: center;
}
.ftrFlow dd p{
    margin-bottom: 0 !important;
}
.ftrFlow dd p strong{
	background-image:linear-gradient( transparent 80%,var(--color-marker-v) 80%,var(--color-marker-v) 100%);
}
.ftrFlow .btnC a{
    background-image: none;
    background-color: transparent;
    border: solid 1px var(--color-white);
    
}
.ftrBnr{
	background:var(--main-color06);
	padding-bottom: 20px !important;
}
.ftrBnr h2{
	text-align: center;
	color: var(--main-color01);
	margin-bottom: 30px;
    position: relative;
}
.ftrBnr h2::before,
.ftrBnr h2::after{
  position: relative;
  display: inline-block;
  content: "" !important;
  background: var(--main-color01);
  width: 2px;
  height: 1.1em;
  margin: 0 0.5em;
  vertical-align: middle;
}
.ftrBnr h2::before {
  transform: rotate(-25deg);
}
.ftrBnr h2::after {
  transform: rotate(25deg);
}
.ftrBnr .inner{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.ftrBnr .inner a{
	display: block;
	margin: 0 10px 50px 0;
	box-shadow: 10px 10px 0 var(--color-gray20);
	position: relative;
}
.ftrBnr .inner a::after,
.ftrBnr .inner a::before{
	z-index: 10;
}
.ftrBnr .inner a::after{
    content: '';
    position: absolute;
    bottom: 15px;
    right: 20px;
    width: 5px;
    height: 1px;
    background: var(--color-white);
    transform: rotate(35deg);
    transition: all .3s;
}
.ftrBnr .inner a::before{
    content: '';
    position: absolute;
    bottom: 13px;
    right: 19px;
    width: 26px;
    height: 1px;
    background:var(--color-white);
    transition: all .3s;
}
.ftrBnr .inner a:hover::after{
    right: 10px;
}
.ftrBnr .inner a:hover::before{
    right: 9px;
}


/* -----------------------------------------------------------
    共通部品
----------------------------------------------------------- */

/*----- contact01 -----*/

.contact01{
	background: linear-gradient( 90deg, var(--main-grd-dark) 0%, var(--main-grd-light) 100%);
    padding: 0 !important;
}
.contact01 .inner{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    color: var(--color-white) !important;
    background: url(./img/top/bg_contact.png) no-repeat right 20px;
    padding: 90px 0 70px 0 !important;
}
.contact01 .inner .boxL,
.contact01 .inner .boxR{
    width: 50%;
    text-align: center;
}
.contact01 .inner .btnC{
    margin-top: 15px;
}
.contact01 .inner .btnC a{
    background: transparent !important;
    border: solid 1px var(--color-white);
    width: 45%;
    padding: 20px 70px 20px 30px;
}
.contact01 .telBox{
    color: var(--color-white);
    width: 100%;
	background: var(--main-color02);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
}
.contact01 .telBox p{
    margin-bottom: 0 !important;
}
.contact01 .telBox .tel{
    margin-left: 30px;
}

/*----- contact02 -----*/
#main .contact02 .tel{
    justify-content:flex-start;
	color: var(--color-black);
    margin-bottom: 0 !important;
}

/*----- searchBox -----*/
#main .searchBox {
	margin-bottom: 50px;
}
#main .searchBox table{
	margin: 0 0 20px;
}
#main .searchBox input[type=checkbox]{
	margin-right: 4px;
}
#main .searchBox input[type=submit]{
	padding: 20px 70px;
}
#main .searchBox label{
	margin-right: 15px;
	display: inline-block;
}

/*----- .shopAccess -----*/

#main ul.shopAccess{
	margin-top: 10px;
}
#main ul.shopAccess>li {
    background: none !important;
    margin: 0 0 !important;
    padding: 0 !important;
}
#main ul.shopAccess li:before,
#main ul.shopAccess li:after {
	content: none;
}

/*----- .msgArea -----*/

#main .msgArea {
    display: flex;
    align-items:flex-start;
    justify-content: space-between;
	gap: 50px;
	margin-top: 30px;
}
#main .msgTxt{
	flex: 1;
}
#main .msgPhoto{
    width: 330px;
}
#main .msgPhoto img{
    height: 400px;
	width: 100%;
    object-fit: cover;
}
#main .msgPhoto p.corp{
	background: var(--main-grd-deepdark);
    display: inline-block;
    color: var(--color-white);
    margin: 10px 0 0 0;
    padding: 1px 10px 2px;
    line-height: 1.3;
}
#main .msgPhoto p.name{
	font-size: 30px;
	font-weight: 700;
	margin-bottom: 0;
	line-height: 1.3;
}
#main .msgPhoto p.name span{
	font-size: 16px;
	margin-right: 10px;
}
#main .msgPhoto p.en {
    color: var(--main-color01);
    font-size: 14px;
	margin-bottom: 0;
}

/*----- .snsShare -----*/
.fb-like > span {
	width: auto !important;
}
.fb_iframe_widget iframe {
	width: 160px !important;
	min-width: 135px !important;
	position: static !important;
}

/* -----------------------------------------------------------
    基本の記事スタイル設定
----------------------------------------------------------- */

#main p {
    font-size: 16px;
    margin-bottom: 15px;
}
#main a {
    color: var(--main-color01);
    text-decoration: underline;
}
#main p+h2,
#main p+h3,
#main p+h4,
#main p+h5,
#main p+h6,
#main ul+h2,
#main ul+h3,
#main ul+h4,
#main ul+h5,
#main ul+h6,
#main ol+h2,
#main ol+h3,
#main ol+h4,
#main ol+h5,
#main ol+h6 {
    margin-top: 30px;
}
#main .inner+p+h2,
#main .inner+p+h3,
#main .inner+p+h4,
#main .inner+p+h5,
#main .inner+p+h6 {
    margin-top: 0;
}
#main h1,
#main h2,
#main h3,
#main h4,
#main h5,
#main h6 {
    line-height: 1.5;
    clear: both;
}

#main h2.headLine{
    font-size: 30px;
    font-weight: 500;
}
#main h2.headLine::first-letter{
    color:var(--main-color01);
}
#main h2.headLine span.en{
    font-family: 'Poppins', sans-serif;
    font-size: 50px;
    font-weight: 600;
    margin-right: 30px;
}
#main h3.headLine{
	background: var(--main-color06);
	font-size: 26px;
	font-weight: 500;
	margin: 0 0 20px 0;
	padding: 5px 15px 6px 15px;
}

/*--ブログ形式ページ--*/

#main h1.pageTitle{
	text-align: center;
	font-size: 36px;
}
#main .taxonomyList{
	margin-top: 50px;
	padding: 30px 30px;
	border-top: solid 1px var(--color-gray30);
	border-bottom: solid 1px var(--color-gray30);
}
#main .taxonomyList h3{
	font-size: 16px;
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}
#main .taxonomyList h3 i{
	margin-right: 10px;
	font-size: 30px;
}
#main .taxonomyList ul.cat{
    width: 100%;
    margin: 0;
}
#main .cat li{
    display: inline-block;
    padding: 0;
    background: none;
    margin: 0 10px 10px 0;
}
#main .cat li:before,
#main .cat li:after{
    content: none;
}
#main .cat li a{
	display: block;
    background: var(--color-gray05);
    color: var(--color-black);
    text-decoration: none;
    padding: 6px 20px;
    font-size: 16px;
}
#main .cat li.current-cat a{
    background: var(--color-black);
    color: var(--color-white);
}
#main .cat li a:last-of-type {
    margin-right: 0;
}
#main .blogList,
#main .worksList,
#main .seminarList{
	padding: 0;
}
#main .seminarList{
	padding-bottom: 50px;
}
#main .worksList{
	border-top: dotted 1px var(--color-black);
	margin-bottom: 40px;
}

#main .blogList article,
#main .worksList article,
#main .seminarList article{
	border-bottom: dotted 1px var(--color-black);
	padding: 40px 0;
}
#main .blogList article a,
#main .worksList article a,
#main .seminarList article a{
	display: flex;
	justify-content: space-between;
	gap: 40px;
	color: var(--color-black);
	text-decoration: none;
}
#main .blogList article a .photoBox,
#main .worksList article a .photoBox,
#main .seminarList article a .photoBox{
	width: 320px;
}
#main .blogList article a .photoBox img,
#main .worksList article a .photoBox img,
#main .seminarList article a .photoBox img{
	width: 320px;
	height: 220px;
	object-fit: cover;
}
#main .blogList article a .outline,
#main .worksList article a .outline,
#main .seminarList article a .outline{
	flex: 1;
}
#main .blogList article a .outline .tit,
#main .worksList article a .outline .cname,
#main .seminarList article a .outline .tit{
	color: var(--main-color01);
	font-weight: 500;
}
#main .seminarList article a .outline .tit{
	margin-bottom: 5px;
}
#main .blogList article a .outline .tit .time,
#main .infoBox .time,
#main .seminarList article a .outline .tit .cat{
	background: var(--main-color01);
	color: var(--color-white);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	margin-right: 10px;
	padding: 0 10px 1px 10px;
}
#main .seminarList article a .outline .time{
	font-weight: 700;
}

#main .worksList article a .outline .cat,
#main .seminarList article a .outline .cat {
	line-height: 1;
	margin-bottom: 5px;
}
#main .blogList article a .outline .cat span,
#main .worksList article a .outline .cat span,
#main .seminarList article a .outline .cat span{
	display: inline-block;
    background: var(--color-gray05);
    color: var(--color-black);
	margin-right: 5px;
	margin-bottom: 5px;
	font-size: 14px;
	line-height: 1.4;
	padding: 0 10px 1px 10px;
}
#main .blogList article a .outline p:last-child,
#main .seminarList article a .outline p:last-child{
	margin-bottom: 0;
}

#main .wp-pagenavi {
    clear: both;
    text-align: center;
    padding-top: 35px;
    margin-bottom: 35px;
}
#main .wp-pagenavi span,
#main .wp-pagenavi a {
    background: var(--color-white);
    display: inline-block !important;
    line-height: 1.2;
}
#main .wp-pagenavi a {
    background: var(--main-color01);
    color: var(--color-white) !important;
    border: none !important;
	text-decoration: none;
}
#main .infoBox ,
#main .editorBox,
#main .editorProf{
	display: flex;
	flex-wrap: wrap;
	align-items:center;
	margin-bottom: 30px;
}
#main .editorBox{
	justify-content: space-between;
}
#main .infoBox .time{
	margin-right: 30px;
}
#main .infoBox .cat,
#main table .cat{
	margin-left: 5px;
}
#main .infoBox .cat a,
#main table .cat a{
	color: var(--color-black);
	text-decoration: none;
	margin: 0 10px 0 0;
	background: none;
	padding: 0;
}
#main table .cat{
	font-size: 12px;
}
#main table .bdrT{
	font-size: 12px;
	padding-top: 5px;
	margin-top: 8px;
	border-top: dotted 1px var(--color-black);
}
#main .infoBox .cat a:hover,
#main table .cat a:hover{
	text-decoration: underline;
}
main .single-content h1,
#main .single-content h1{
	font-size: 36px;
	line-height: 1.4;
	margin-bottom: 30px;
	font-weight: 500;
}
#main .editorProf{
	margin-bottom: 0;
}
#main .editorProf .photoBox{
	width: 60px;
	height: 60px;
}
#main .editorProf .photoBox img{
	width: 100%;
	height: 100%;
	border-radius: 50vh;
	object-fit: cover;
}
#main .editorProf .staffName{
	margin: 0 0 0 15px;
	font-weight: 500;
}
#main .wysiwyg{
	overflow: hidden;
}
#main .freeCom,
#main .cstCom,
#main .cstStaff{
	margin: 20px 0 50px 0;
}
#main .wysiwyg *{
	word-break: break-word;
}
#main .wysiwyg img {
    max-width: 100%;
    height: auto;
}
#main .wysiwyg p{
	margin: 0 0 20px 0;
}
#main .wysiwyg iframe{
	width: 100%;
	height: 500px;
}
#main .wysiwyg h1,
#main .wysiwyg h2{
	background: var(--main-color01);
	color: var(--color-white);
	font-size: 30px;
	font-weight: 500;
	margin: 0 0 20px 0;
	padding: 5px 15px 6px 15px;
}
#main .wysiwyg h1 a,
#main .wysiwyg h2 a{
	color: var(--color-white);
}
#main .wysiwyg h3{
	background: var(--main-color02);
	color:var(--color-white);
	font-size: 26px;
	font-weight: 500;
	margin: 0 0 20px 0;
	padding: 5px 15px 6px 15px;
}
#main .wysiwyg h4{
	font-size: 20px;
	font-weight: 500;
	border-top: solid 2px var(--main-color01);
	border-bottom: solid 2px var(--main-color01);
	margin: 0 0 20px 0;
	padding: 5px 0 6px 0;
}
#main .wysiwyg h5{
	font-size: 16px;
	font-weight: 500;
	border-bottom: double 3px var(--main-color01);
	margin: 0 0 20px 0;
	padding: 0 0 6px 0;
}
#main .wysiwyg h6{
	font-size: 16px;
	font-weight: 500;
	border-bottom: dotted 2px var(--main-color01);
	margin: 0 0 20px 0;
	padding: 0 0 6px 0;
}
#main blockquote {
    border: dotted 1px var(--color-black);
    background: var(--color-gray05);
    padding: 15px;
    margin-bottom: 20px;
}
#main blockquote p {
    margin: 0 !important;
}
#main ul {
    margin-bottom: 20px;
    list-style: none;
    padding: 0;
}
#main ul li{
    list-style: none;
    line-height: 1.8;
    margin-bottom: 10px;
    padding-left: 35px;
    position: relative;
}
#main ul li:before {
    content: '';
    display: block;
    left: 8px;
    top: 11px;
    width: 8px;
    height: 8px;
    background: var(--main-color01);
    border-radius: 50%;
    position: absolute;
}
#main ol {
    counter-reset: my-counter;
    list-style: none;
    padding: 0;
    margin-bottom: 30px;
}
#main ol li {
    list-style: none;
    line-height: 1.8;
    margin-bottom: 10px;
    padding-left: 36px;
    position: relative;
}
#main ol li:before {
    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    content: counter(my-counter);
    counter-increment: my-counter;
    background-color: var(--main-color01);
    color: var(--color-white);
    display: block;
    float: left;
    line-height: 28px;
    margin-left: -36px;
    text-align: center;
    height: 28px;
    width: 28px;
    border-radius: 50%;
}
#main table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 1px;
    margin-bottom: 30px;
	margin-top:30px;
	border-bottom: var(--color-gray60) solid 1px;
	border-right: var(--color-gray60) solid 1px;
}
#main h2 + table{
	margin-top:20px;
}
#main table th,
#main table td {
    padding: 15px 20px;
    font-size: 15px;
    line-height: 1.7;
    text-align: left;
    vertical-align: top;
    position: relative;
    border-top: var(--color-gray60) solid 1px;
    border-left: var(--color-gray60) solid 1px;
}
#main table th p,
#main table td p{
	margin-bottom: 0 !important;
}
#main table th {
    width: 20%;
    font-weight: 700;
    vertical-align: top;
    font-size: 15px;
    background: none;
	background: var(--color-gray05);
}
#main .wysiwyg table th {
    width: unset;
}
#main table td a {
	display: inline-block;
    background: var(--main-color01);
    border-radius: 50vh;
    color: var(--color-white);
    text-decoration: none;
    padding: 0 15px;
	margin: 5px 0 0 0;
}
#main table td a:hover {
    opacity: 0.7;
    transition: 0.6s;
}
#main .pagenavi {
    clear: both;
    width: 100%;
    max-width: 1200px;
    margin: 0;
	padding: 40px 0;
}
#main .pagenavi ul{
    display: flex;
    justify-content: space-between;
    margin: 0;
}
#main .pagenavi ul li{
    display: block;
    width: 33.3%;
    padding: 0 !important;
	margin-bottom: 0;
}
#main .pagenavi ul li:before{
	content: none;
}
#main .pagenavi ul li a{
    display: inline-block;
	border: solid 1px var(--color-black);
    color: var(--color-black);
    font-size: 16px;
    font-weight: 400;
    padding: 5px 10px 5px 10px;
    width: 40%;
    box-sizing: border-box;
    text-decoration:none !important;
    text-align: center;
	border-radius: 100vh;
}
#main .pagenavi ul li a:hover{
    background-color: var(--color-black);
    color: var(--color-white);
    transition: 0.7s;
}
#main .pagenavi ul li.next{
    text-align: left;
}
#main .pagenavi ul li.next a i{
    margin-right: 1.0rem;
}
#main .pagenavi ul li.prev{
    text-align: right;
}
#main .pagenavi ul li.prev a i{
    margin-left: 1.0rem;
}
#main .pagenavi ul li.list{
    text-align: center;
}

/*--フォーム部品--*/
#main .formBox table{
	border-right: none !important;
}
.formBox table th, .formBox table td,
#main .formBox table th, #main .formBox table td{
	border: none;
    padding: 20px 60px;
    line-height: 1.3;
    vertical-align: top;
}
.formBox table th,
#main .formBox table th{
    width: 30%;
    font-weight: 500;
	vertical-align: middle;
}
.formBox table th p, .formBox table td p{
    margin-bottom: 0 !important;
}
.formBox table th span{
    display: block;
    font-size: 14px;
    color: var(--color-red);
}
.formBox input:not(input[type="checkbox"]):not(input[type="submit"]):not(input[type="radio"]),
.formBox select,
.formBox textarea{
    font-size: 16px;
    padding: 5px;
    height: 40px;
    width: 380px;
    border: 1px solid var(--color-gray20);
    box-sizing: border-box;
    background: var(--color-white);
}
.formBox input:not(input[type="checkbox"]):not(input[type="submit"]):not(input[type="radio"])::placeholder,
.formBox textarea::placeholder{
	color: var(--color-gray20);
	font-weight: 400;
}
.formBox input[name="your-add"]{
    width: 98% !important;
}
.formBox select{
    width: 300px;
}
.formBox textarea{
    height: 60px;
    width: 98%;
}
.formBox input[type="checkbox"],
.formBox input[type="radio"]{
    transform: scale(1.5);
    margin: 0 6px 0 0;
}
.formBox input[type="submit"],
.searchBox input[type="submit"]{
    display: inline-block !important;
    border-radius: 100vh;
    border: none;
    font-size: 16px;
    font-weight: 500;
    background: linear-gradient( 90deg, var(--main-grd-dark) 0%, var(--main-grd-light) 100%);
    text-align: center;
    line-height: 1.2;
    padding: 20px 30px;
    text-decoration: none !important;
    color: var(--color-white) !important;
	cursor: pointer;
}
.formBox input[type="submit"]:disabled{
    font-size: 16px;
    background: var(--color-gray30);
    color: var(--color-white) !important;
	cursor: default;
}
.formBox .wpcf7-spinner {
    display: none !important;
	margin:10px auto 0;
}
.submitting .formBox .wpcf7-spinner {
    display: block !important;
}
.formBox input[readonly="readonly"]{
	background: var(--color-gray05) !important;
    color: var(--color-gray70);
    width: 100% !important;
}

/*--写真並び（3列）--*/
#main .photoUL{
	display: flex;
	align-items:flex-start;
	flex-wrap: wrap;
	gap: 40px;
	margin-bottom: 50px;
}
#main .photoUL li{
	display: block;
    width: calc((100% - 80px)/3);
    margin: 0;
    padding: 0;
    font-size: 16px;
}
#main .photoUL .otherPhoto {
    width: 100%;
    height: 270px;
    display: block;
	margin-bottom: 10px;
}
#main .photoUL .otherPhoto a{
	display: block;
}
#main .photoUL .otherPhoto img {
    width: 100%;
    height: 270px;
	object-fit: cover;
}
#main .photoUL li h5 {
    color: var(--main-color01);
	font-size: 16px;
	font-weight: 700;
}
#main .photoUL li:before,
#main .photoUL li:after,
#main .photoUL li h5:after {
    content: none;
}

/*--下層ページメインビジュアル--*/

#cornerName {
	position: relative;
	height: 350px;
	width: 100%;
	z-index: 3;
}
#cornerName::after {
	position: absolute;
	top:0;
	width: 1019px;
	right: 110px;
	height: 350px;
	content: '';
	background: url(./img/common/bg_pageTitle.png) no-repeat right top;
	z-index: 2;
}
#cornerName::before {
	position: absolute;
	content: '';
	display: block;
	background-color: var(--main-grd-dark);
	height: 350px;
	width: calc(100% - 400px );
	z-index: 1;
}
#cornerName h1,
#cornerName div {
	position: relative;
	display: block;
    width: 100%;
    margin: 0 auto;
	padding: 125px 0 0 0;
	max-width: 1200px;
    color: var(--color-white);
    font-size: 46px;
	font-weight: 400;
    line-height: 1.2;
	z-index: 4;
}
#cornerName h1 span.en,
#cornerName div span.en {
    display: block;
    margin: 0 auto;
    font-size: 26px;
	color: var(--main-color02);
}
#cornerName h1 span.en::first-letter,
#cornerName div span.en::first-letter{
	color: var(--main-color01);
}
.breadcrumbs {
	width: 100%;
	margin: 0 auto;
	max-width: 1200px;
	font-size: 12px;
	color: var(--color-white);
	padding: 20px;
}
.breadcrumbs a{
	color: var(--color-white);
}

/*--メインカラム--*/

#contents {
    margin: 0 auto 0;
}
#top #contents {
    margin: 30px auto 0;
}
#contents section {
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    padding: 50px 0;
}
#contents #main section + section{
    padding: 0 0 50px 0;
}
#top #contents #main section + section{
    padding: 50px 0;
}

/*投稿画像の回り込み処理*/

img.centered {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

img.alignright {
    padding: 0;
    margin: 0 0 2px 7px;
    display: inline;
}

img.alignleft {
    padding: 0;
    margin: 0 30px 10px 0;
    display: inline;
}

img.aligncenter {
    display: block;
    margin: 0 auto;
}

.alignright {
    float: right;
    margin-left: 10px;
    margin-bottom: 2px;
}

.alignleft {
    float: left;
    margin-right: 10px;
    margin-bottom: 2px;
}

img {
    border-style: none;
}

#main .nobr br {
    display: none;
}

#main p.wp-caption {
    font-size: 0.8em;
    line-height: 1.2em;
}

#main p.wp-caption img {
    margin-bottom: 5px;
}

#main p.wp-caption .caption-text {
    text-align: left;
}


/* -----------------------------------------------------------
    #top
----------------------------------------------------------- */

#top #contents section#main{
    padding: 0;
}
#top #main h2{
    font-size: 30px;
    font-weight: 500;
}
#top #main h2::first-letter{
    color:var(--main-color02);
}
#top #main h2 span.en{
    font-family: 'Poppins', sans-serif;
    font-size: 50px;
    font-weight: 600;
    margin-right: 30px;
}
#top #main ul li{
    padding: 0;
}
#top #main ul li::after,
#top #main ul li::before{
    content: none !important;
}
#top #main ul li a{
    text-decoration: none;
    color: var(--color-black);
}

/*-------------------#mainv-----------------*/
#mainv {
    position: relative;
    width: calc(100% - 110px);
    max-width: 1820px;
    height: 650px;
    z-index: 9;
    background: url(./img/top/mainv_company.jpg) top center no-repeat;
    display: flex;
    align-items: center;
	justify-content:center;
}
#mainv h2{
	width:fit-content;
	padding: 0 0 120px 100px;
}
#mainv h2 span{
    color: var(--color-white);
    font-weight: 900;
    line-height: 1.3;
    display: block;
}
#top #mainv h2 span:nth-of-type(1){
    font-size: 30px;
    transform: skewX(-15deg);
	color:var(--color-yellow);
	text-shadow: rgb(34, 34, 34) 3px 0px 0px, rgb(34, 34, 34) 2.83487px 0.981584px 0px, rgb(34, 34, 34) 2.35766px 1.85511px 0px, rgb(34, 34, 34) 1.62091px 2.52441px 0px, rgb(34, 34, 34) 0.705713px 2.91581px 0px, rgb(34, 34, 34) -0.287171px 2.98622px 0px, rgb(34, 34, 34) -1.24844px 2.72789px 0px, rgb(34, 34, 34) -2.07227px 2.16926px 0px, rgb(34, 34, 34) -2.66798px 1.37182px 0px, rgb(34, 34, 34) -2.96998px 0.42336px 0px, rgb(34, 34, 34) -2.94502px -0.571704px 0px, rgb(34, 34, 34) -2.59586px -1.50383px 0px, rgb(34, 34, 34) -1.96093px -2.27041px 0px, rgb(34, 34, 34) -1.11013px -2.78704px 0px, rgb(34, 34, 34) -0.137119px -2.99686px 0px, rgb(34, 34, 34) 0.850987px -2.87677px 0px, rgb(34, 34, 34) 1.74541px -2.43999px 0px, rgb(34, 34, 34) 2.44769px -1.73459px 0px, rgb(34, 34, 34) 2.88051px -0.838247px 0px,rgb(255, 255, 255) 6px 0px 0px, rgb(255, 255, 255) 5.91686px 0.995377px 0px, rgb(255, 255, 255) 5.66974px 1.96317px 0px, rgb(255, 255, 255) 5.2655px 2.87655px 0px, rgb(255, 255, 255) 4.71532px 3.71022px 0px, rgb(255, 255, 255) 4.03447px 4.44106px 0px, rgb(255, 255, 255) 3.24181px 5.04883px 0px, rgb(255, 255, 255) 2.35931px 5.51667px 0px, rgb(255, 255, 255) 1.41143px 5.83163px 0px, rgb(255, 255, 255) 0.424423px 5.98497px 0px, rgb(255, 255, 255) -0.574341px 5.97245px 0px, rgb(255, 255, 255) -1.55719px 5.79441px 0px, rgb(255, 255, 255) -2.49688px 5.45578px 0px, rgb(255, 255, 255) -3.36738px 4.96596px 0px, rgb(255, 255, 255) -4.14455px 4.33852px 0px, rgb(255, 255, 255) -4.80686px 3.59083px 0px, rgb(255, 255, 255) -5.33596px 2.74364px 0px, rgb(255, 255, 255) -5.71718px 1.8204px 0px, rgb(255, 255, 255) -5.93995px 0.84672px 0px, rgb(255, 255, 255) -5.99811px -0.150428px 0px, rgb(255, 255, 255) -5.89004px -1.14341px 0px, rgb(255, 255, 255) -5.61874px -2.1047px 0px, rgb(255, 255, 255) -5.19172px -3.00766px 0px, rgb(255, 255, 255) -4.62082px -3.82727px 0px, rgb(255, 255, 255) -3.92186px -4.54081px 0px, rgb(255, 255, 255) -3.11421px -5.12852px 0px, rgb(255, 255, 255) -2.22026px -5.57409px 0px, rgb(255, 255, 255) -1.26477px -5.86518px 0px, rgb(255, 255, 255) -0.274238px -5.99373px 0px, rgb(255, 255, 255) 0.723898px -5.95617px 0px, rgb(255, 255, 255) 1.70197px -5.75355px 0px, rgb(255, 255, 255) 2.63288px -5.39147px 0px, rgb(255, 255, 255) 3.49082px -4.87998px 0px, rgb(255, 255, 255) 4.25202px -4.23324px 0px, rgb(255, 255, 255) 4.89538px -3.46919px 0px, rgb(255, 255, 255) 5.40307px -2.60899px 0px, rgb(255, 255, 255) 5.76102px -1.67649px 0px, rgb(255, 255, 255) 5.95932px -0.697531px 0px,0px 0px 20px var(--color-white),0px 0px 20px var(--color-white);
}
#top #mainv h2 span:nth-of-type(1) b{
	color:var(--color-red);
	margin:0 6px;
}
#top #mainv h2 span:nth-of-type(2){
    font-size: 75px;
    transform: skewX(-15deg);
	text-shadow:0px 0px 20px var(--color-black);
}
#top #mainv h2 span:nth-of-type(3){
    font-weight: 400;
    font-size: 20px;
	margin-top: 10px;
    display: flex;
    gap: 10px;
}
#top #mainv h2 span:nth-of-type(3) b{
    background: var(--color-black);
    padding: 5px 30px;
    display: inline-block;
	box-shadow:0px 0px 20px var(--color-white);
}

/*-------------------.topBnrArea-----------------*/
.topBnrArea{
    margin-top: 70px;
}
.topBnrArea .swipswiperTopBnrer{
    width: 100%;
    margin: auto;
}
.topBnrArea .swiperTopBnr .swiper-button-next,
.topBnrArea .swiperTopBnr .swiper-button-prev {
    width: 52px;
    height: 52px;
}
.topBnrArea .swiperTopBnr .swiper-button-next:after,
.topBnrArea .swiperTopBnr .swiper-button-prev:after {
    content: none;
}
.topBnrArea .swiperTopBnr .swiper-button-next {
    background: url(./img/top/arrowR.png) no-repeat;
}
.topBnrArea .swiperTopBnr .swiper-button-prev {
    background: url(./img/top/arrowL.png) no-repeat;
}
.topBnrArea .mainBtnList{
    margin: 0 auto !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    overflow: visible;
    width: 1200px;
}
.topBnrArea .mainBtnList li{
    width: 240px;
    height: 240px;
    padding: 30px !important;
    border:solid 1px var(--color-gray20);
    box-sizing: border-box;
    text-align: center;
}
.topBnrArea .mainBtnList li img{
    width: 180px;
    height: 180px;
    object-fit: contain;
}
.topBnrArea .mainBtnList li p{
    width: 180px;
    height: 180px;
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    font-size: 16px;
    font-weight: 500;
}

/*-------------------.topTroubleArea-----------------*/
.topTroubleArea{
    background: url(./img/top/bg_trouble.jpg) no-repeat top center var(--color-white);
    padding-top: 10px !important;
}
.topTroubleArea h2{
    text-align: center;
    color: var(--color-white);
    line-height: 1.2 !important;
    font-size: 46px !important;
    font-weight: 700 !important;
    margin-bottom: 15px;
}
.topTroubleArea h2::first-letter{
    color: inherit !important;
}
.topTroubleArea h2 .en{
    opacity: 0.08;
    font-size: 110px !important;
    display: block;
    margin-bottom: -55px;
}
.topTroubleArea ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-bottom: 35px !important;
    margin-bottom: 20px !important;
    background: url(./img/top/arrow_trouble.png) no-repeat bottom center;
}
.topTroubleArea li{
    display: block;
    width: 380px;
    text-align: center;
    margin-bottom: 15px !important;
	padding: 0 !important;
}
.topTroubleArea li::after,
.topTroubleArea li::before{
    content: none !important;
}
.topTroubleArea li div img{
    margin-bottom: -40px;
    z-index: 2;
    position: relative;
}
.topTroubleArea li div{
    display: block;
    width: 100%;
    font-weight: 500;
	text-decoration: none !important;
	color: var(--color-black) !important;
}
.topTroubleArea li div p{
    background-color: var(--color-white);
    padding: 55px 0 40px 0;
    margin: 0 !important;
    line-height: 1.3 !important;
    background-size: cover;
    background-color:rgba(255,255,255,1.0);
    background-blend-mode:lighten;
    position: relative;
    z-index: 1;
}
.topTroubleArea li div p strong{
    display: block;
    font-size: 46px;
    font-weight: 500;
}
.topTroubleArea li div p strong span{
    color: var(--main-color02);
}
.topTroubleArea li:nth-child(1) div p{
    background-image: url(./img/top/bt_trouble_toso.jpg);
}
.topTroubleArea li:nth-child(2) div p{
    background-image: url(./img/top/bt_trouble_bosui.jpg);
}
.topTroubleArea li:nth-child(3) div p{
    background-image: url(./img/top/bt_trouble_floor.jpg);
}
.topTroubleArea li:nth-child(4) div p{
    background-image: url(./img/top/bt_trouble_metal.jpg);
}
.topTroubleArea li:nth-child(5) div p{
    background-image: url(./img/top/bt_trouble_small.jpg);
}
.topTroubleArea li:nth-child(6) div p{
    background-image: url(./img/top/bt_trouble_rain.jpg);
}
.topTroubleArea .btnC b{
    background: url(./img/top/bnr_trouble_costdown01.png) no-repeat 35px 25px var(--main-color06);
    color: var(--main-color01) !important;
    font-weight: 700;
    font-size: 30px;
    line-height: 1.2;
    text-align: left;
    padding: 55px 0 0 250px;
    width: 100%;
    position: relative;
    height: 200px;
    box-sizing: border-box;
    display: inline-block !important;
    border-radius: 100vh;
}
.topTroubleArea .btnC b span{
    font-size: 42px;
}
.topTroubleArea .btnC b::before{
    content: none;
}
.topTroubleArea .btnC b::after{
	content: '';
    position: absolute;
    background: url(./img/top/bnr_trouble_costdown02.png) no-repeat transparent;
    background-size: contain;
    width: 213px;
    height: 199px;
    transform: rotate(0deg);
    bottom: -40px;
    right: 5px;
}
.topTroubleArea i{
	font-style:normal;
}
.topTroubleArea .inner{
    overflow: visible;
}

/*-------------------.topStrongArea-----------------*/
.topStrongArea{
    background: var(--color-gray05);
    margin: 0 0 60px 0 !important;
    margin-right: calc(calc(100% - 1200px) / 2) !important;
}
.topStrongArea .inner{
    margin-right: 0 !important;
    box-sizing: border-box;
    padding: 0 60px 0 0;
}
.topStrongArea h2 {
    text-align: right;
}
.topStrongArea h2::first-letter{
	color:var(--main-color02);
}
.topStrongArea h2 span.num{
	color:var(--main-color02);
}
.topStrongArea ol{
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    counter-reset: number 0 !important;
}
.topStrongArea ol li{
    display: flex;
    justify-content: space-between;
    list-style-type: none !important;
    margin: 120px 0 0 0 !important;
	padding: 0 !important;
    gap:35px;
}
.topStrongArea ol li::before{
	content: none !important;
}
.topStrongArea ol li .photoBox {
    position: relative;
}
.topStrongArea ol li .photoBox::after {
    counter-increment: number 1;
    content: counter(number,decimal-leading-zero);
    position: absolute;
    top: -50px;
    left: 10px;
    font-family: 'Poppins', sans-serif;
    font-size: 80px;
    font-weight: 600;
    line-height: 1;
    display: block;
    border-bottom: solid 3px var(--color-black);
}
.topStrongArea ol li:nth-child(2){
    flex-direction: row-reverse;
}
.topStrongArea h3{
    color: var(--main-color02);
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 15px;
}
.topStrongArea p{
    line-height: 1.8;
}
.topStrongArea p strong{
    background-image: linear-gradient( transparent 80%,var(--color-marker-v) 80%,var(--color-marker-v) 100%);
}

/*-------------------.topWorksArea-----------------*/

#main .topWorksArea .swiperTopWorks{
    width: 100%;
    margin: auto;
}
#main .topWorksArea .swiperTopWorks .swiper-button-next,
#main .topWorksArea .swiperTopWorks .swiper-button-prev {
    width: 52px;
    height: 52px;
    top:34%;
}
#main .topWorksArea .swiperTopWorks .swiper-button-next:after,
#main .topWorksArea .swiperTopWorks .swiper-button-prev:after {
    content: none;
}
#main .topWorksArea .swiperTopWorks .swiper-button-next {
    background: url(./img/top/arrowR.png) no-repeat;
}
#main .topWorksArea .swiperTopWorks .swiper-button-prev {
    background: url(./img/top/arrowL.png) no-repeat;
}
#main .topWorksArea .swiperTopWorks ul{
    margin: 0 auto 50px !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    overflow: visible;
    width: 1200px;
}
#main .topWorksArea .swiperTopWorks ul li{
    display: block;
    width: 580px;
    margin: 0;
	padding: 0;
}
#main .topWorksArea .swiperTopWorks ul li::before{
	content: none;
}
#main .topWorksArea ul li a{
	text-decoration: none;
	color: var(--color-black);
}
#main .topWorksArea .swiperTopWorks ul li a img{
    width: 100%;
    height: 380px;
    object-fit: cover;
}
#main .topWorksArea .swiperTopWorks ul li a p{
    margin-bottom: 0;
}
#main .topWorksArea .swiperTopWorks ul li a p.tax{
    margin-top: 10px;
}
#main .topWorksArea .swiperTopWorks ul li a p.tax span{
    background-color: var(--color-gray05);
    display: inline-block;
    margin-right: 5px;
    padding: 1px 10px;
    font-size: 14px;
}
#main .topWorksArea .swiperTopWorks ul li a p.cname{
    color: var(--main-color01);
    border-bottom: solid 1px var(--color-black);
    padding: 15px 0;
}
#main .topWorksArea .swiperTopWorks ul li a p.part{
    font-weight: 700;
    margin-top: 10px;
}
#main .topWorksArea .swiperTopWorks ul li a p.excerpt{
    margin-top: 10px;
    font-size: 14px;
}

/*-------------------.bnrDownload-----------------*/
#main .bnrDownload{
    max-width: 1200px;
    padding-top: 0;
}
#main .bnrDownload a{
    display: block;
    width: 100%;
    height: 280px;
    margin: 0 auto 50px;
    box-sizing: border-box;
    background: url(./img/top/bg_download.png) no-repeat bottom right;
    text-decoration: none;
    color: var(--color-white);
    padding: 90px 0 0 60px;
    background-color: var(--color-white);
    background-size: cover;
    background-color:rgba(255,255,255,0.0);
    background-blend-mode:lighten;
    position: relative;
    z-index: 1;
}
#main .bnrDownload a:hover{
    background-color:rgba(255,255,255,0.2);
    transition: background-color 0.6s;
}
#main .bnrDownload a .btn{
    display: inline-block;
    border-radius: 100vh;
    border: solid 1px var(--color-white);
    font-size: 22px;
    padding: 15px 70px 15px 30px;
    position: relative;
}
#main .bnrDownload .btn::after{
    content: '';
    position: absolute;
    bottom: calc(50% - 1px);
    right: 26px;
    width: 5px;
    height: 1px;
    background: var(--color-white);
    transform: rotate(35deg);
    transition: all .3s;
}
#main .bnrDownload .btn::before{
    content: '';
    position: absolute;
    bottom: calc(50% - 3px);
    right: 25px;
    width: 25px;
    height: 1px;
    background:var(--color-white);
    transition: all .3s;
}
#main .bnrDownload a .btn:hover::after{
    right: 21px;
}
#main .bnrDownload a .btn:hover::before{
    right: 20px;
}

/*-------------------.topBlogArea-----------------*/
.topBlogArea{
    background: url(./img/top/bg_blog.jpg) left bottom no-repeat var(--color-gray05);
    margin: 0 0 0 0 !important;
    padding: 50px 0 70px !important;
}
.topBlogArea .inner{
    max-width: unset;
    margin: 0 !important;
    margin-left: calc(calc(100% - 1200px) / 2) !important;
    box-sizing: border-box;
    padding: 60px 0 30px 60px;
    background: var(--color-white);
}
.topBlogArea h2 {
    margin: 0 auto 20px;
    max-width: 1200px;
}
.topBlogArea .topBlogList{
    max-width: calc(1200px - 120px);
}
#main .topBlogArea ul{
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px;
	gap:40px;
}
.topBlogArea ul li{
    width: 240px;
}
.topBlogArea ul li img.mainThumb{
    width: 100%;
    height: 200px;
    object-fit: cover;
}
#main .topBlogArea ul li a p{
    margin-bottom: 0;
}
#main .topBlogArea ul li a p.tit{
    margin-top: 10px;
    color: var(--main-color01);
    font-weight: 500;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#main .topBlogArea ul li a p.excerpt{
    margin-top: 10px;
    font-size: 14px;
}
#main .topBlogArea ul li a p.time{
    text-align: right;
    margin-top: 10px;
    color: var(--color-gray60);
    font-size: 12px;
}

/*-------------------.topSeminarArea-----------------*/
.topSeminarArea{
    padding-top: 60px;
}
.topSeminarArea .inner{
    max-width: 900px;
}
.topSeminarArea h2{
    text-align: center;
    margin-bottom: 20px;
}
.topSeminarArea ul{
    border-top: dotted 1px var(--color-black);
    margin-bottom: 30px !important;
}
.topSeminarArea ul li{
    border-bottom: dotted 1px var(--color-black);
    padding: 20px 0 !important;
}
.topSeminarArea ul li{
    border-bottom: dotted 1px var(--color-black);
    padding: 20px 0 !important;
    overflow: hidden;
}
.topSeminarArea ul li .photoBox{
    float: right;
    width: 160px;
    margin-left: 30px;
}
.topSeminarArea ul li .photoBox .mainThumb{
    width: 100%;
    height: 120px;
    object-fit: cover;
}
.topSeminarArea ul li .outline{
    overflow: hidden;
}
#main .topSeminarArea ul li .outline p{
	margin-bottom: 5px;
}
.topSeminarArea ul li .outline .status,
.topSeminarArea ul li .outline .cat{
    color: var(--color-white);
    border-radius: 100vh;
    line-height: 1;
    padding: 5px 10px 6px;
    margin-right: 5px;
    font-size: 12px;
    display: inline-block;
}
.topSeminarArea ul li .outline .cat{
    background: var(--main-color01);
}
.topSeminarArea ul li .outline .tit{
    font-weight: 700;
}
.topSeminarArea ul li .outline .time{
    color: var(--main-color01);
    font-size: 14px !important;
    font-weight: 700;
    margin-bottom: 5px !important;
}
.topSeminarArea ul li .outline .excerpt{
    font-size: 14px !important;
    margin-bottom: 0 !important;
}

/*------------------- #corporate 会社案内 -----------------*/

#corporate #main{
	padding-top: 0 !important;
}
#corporate #main .philosophy{
	padding: 60px 0 !important;
	background: url(./img/common/bg_philosophy.png) no-repeat right bottom var(--main-color06);
}
#corporate #main .philosophy h2{
	text-align: center;
	line-height: 1.2;
	margin-bottom: 20px;
	color: var(--main-color01);
}
#corporate #main .philosophy .en{
	display: block;
    font-size: 50px;
	color: var(--color-black);
}
#corporate #main .philosophy .en::first-letter{
    color:var(--main-color01);
}
#corporate #main .philosophy p{
	text-align: center;
}
#corporate #main .philosophy p:nth-of-type(1){
	font-weight: 700;
	font-size: 35px;
	margin-bottom: 50px;
}
#corporate #main .philosophy p:nth-of-type(2){
	font-size: 20px;
}
#corporate #main table.historyT th{
    width: 26%;
}
#main .suppliersBox {
    background: var(--color-gray05);
    padding: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
#main .suppliersBox li{
    width: calc(50% - 10px);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/*------------------- #staff スタッフ紹介 -----------------*/

body#staff.staffCbox {
    min-width: unset;
}
body#staff.staffCbox .zsiq_floatmain {
    display: none !important;
}
#staff #main h2 {
	border-bottom: solid 2px var(--main-color04);
	margin: 50px 0 30px;
}
#staff #main .staffList {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-bottom: 0;
	gap: 20px;
}
#staff #main .staffList li {
	margin: 0;
	padding: 0;
	width: 250px;
}
#staff #main .staffList::before,
#staff #main .staffList::after {
	content: "";
    display: block;
	width: 250px;
    height: 0;
}
#staff #main .staffList::before{
	order: 1;
}
#staff #main .staffList li a {
    text-decoration: none;
	color: var(--color-black);
}
#staff #main .staffList li:before,
#staff #main .staffList li:after {
    content: none;
}
#staff #main .staffList li .positionTxt {
    display: block;
    margin: 0;
    text-align: center;
}
#staff #main .staffList li .positionTxt span,
#staff #main .staffProf .profileDetail .positionTxt span {
    font-size: 12px;
    font-weight: 400;
    text-align: left;
    padding: 2px 5px;
    line-height: 1.2;
    margin-right: 5px;
    color: var(--color-white);
    background: var(--main-color01);
    display: inline-block;
}
#staff #main .staffName {
    color: var(--color-black);
    font-size: 20px;
    line-height: 1.3;
    font-weight: 700;
    margin-bottom: 10px;
}
#staff #main .staffList .staffName {
	text-align: center;
}
#staff #main .staffList li .staffName span,
#staff #main .staffProf .profileDetail .staffName span {
    color: var(--main-color01);
    font-size: 14px;
    display: block;
    padding-left: 10px;
}
#main .staffSingle{
	padding: 20px;
	display: flex;
	gap: 40px;
}
#staff .photoBox{
	width: 250px;
	height: 280px;
	margin-bottom: 5px;
}
#staff .photoBox .mainThumb{
	width: 100%;
	height: 280px;
	object-fit: cover;
}
#main .staffSingle .profileDetail {
	flex: 1;
}
#main .staffSingle .profileDetail .positionTxt {
    margin-top: 0;
    font-size: 12px;
    margin-bottom: 5px !important;
	background-color: var(--main-color01);
	color: var(--color-white);
	display: inline-block;
	padding: 3px 10px 2px;
	line-height: 1.0;
}
#main .staffSingle .profileDetail .staffName span.en {
    display: inline-block;
    margin-left: 10px;
	color: var(--main-color01);
	font-size: 14px;
}
#main .staffSingle .profileDetail dl dt {
    background: var(--main-color06);
    font-weight: 700;
    display: block;
    padding: 3px 10px;
    margin: 15px 0 10px;
}
#main .staffSingle #btnClose {
    font-size: 14px !important;
    text-decoration: none !important;
    color: var(--color-white) !important;
    text-align: center;
    display: block;
    width: 6em;
    margin: 30px auto 0 auto !important;
    padding: 2px 20px;
    background:var(--main-color01);
}

/*------------------- #contact お問い合わせ -----------------*/

#contact #main {
	padding-bottom: 0;
}
#contact #main .messageBox {
	padding: 0 0 50px;
}

/*------------------- #faq よくあるご質問 -----------------*/
#faq #main {
	padding-top: 0;
}
#faq #main .ftrFaq .faqAnswer{
    max-height: 500px !important;
    border-bottom-width: 1px !important;
    transition: all 1.5s !important;
}
#faq #main .ftrFaq .title::after,
#faq #main .ftrFaq .title::before {
    content: none;
}

/*------------------- #flow 施工の流れ -----------------*/

#flow #main {
	padding-top: 0;
}
#flow #main .pageLead{
	padding: 60px 0 !important;
	margin-bottom: 0;
	background: url(./img/common/bg_philosophy.png) no-repeat right bottom var(--main-color06);
}
#flow #main .pageLead p{
	text-align: center;
    font-size: 50px;
    font-weight: 700;
    line-height: 1.5;
}
#flow #main .flowList{
	margin-top: 30px;
}
#flow #main .flowItem{
	display: flex;
	justify-content: space-between;
	align-content: flex-start;
	gap: 40px;
	margin-bottom: 40px;
}
#flow #main .photoBox{
	width: 500px;
	position: relative;
	padding: 10px 0 0 10px;
	margin-top: -10px;
	box-sizing: border-box;
	overflow: hidden;
}
#flow #main .photoBox::before,
#flow #main .photoBox::after{
	content: '';
	width: 0;
	height: 0;
	position: absolute;
    top: -24px;
    left: 87px;
	z-index: -1;
	border: 17px solid;
	border-color: transparent transparent var(--color-reddark) transparent;
}
#flow #main .photoBox::after{
    top: 90px;
    left: -20px;
    border: 20px solid;
    border-color: transparent var(--color-reddark) transparent transparent;
}
#flow #main .photoBox span.label{
	position: absolute;
    display: inline-block;
    left: -37px;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.2), inset 0px 5px 30px rgba(255,255,255,0.2);
    text-align: center;
    text-transform: uppercase;
    top: 20px;
    background: var(--color-red);
    width: 136px;
    padding: 6px 10px;
	transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    z-index: 1000;
    color: var(--color-white);
}
#flow #main .photoBox span.label::after{
	content: counter(my-counter,decimal-leading-zero);
    counter-increment: my-counter;
	margin-left: 5px;
}
#flow #main .photoBox img{
	width: 100%;
	height: 300px;
	object-fit: cover;
}

#flow #main .textBox{
	flex:1;
}
#flow #main .textBox h3{
	background: var(--main-color01);
	color: var(--color-white);
}
#flow #main .contact01{
	margin-bottom: 50px;
}
#flow #main ol.flowList li{
	padding: 0;
}
#flow #main ol.flowList li:before{
	content: none;	
}

/*------------------- #works 施工事例 -----------------*/

#works #main h1.pageTitle{
	margin-bottom: 20px;
}
#main .picBox {
	display: flex;
	gap: 40px;
    margin-bottom: 50px;
	justify-content: space-between;
	flex-direction: row-reverse;
}
#main .picBox .photo {
    width: 60%;
    height: 470px;
	position: relative;
}
#main .picBox .photo img {
	object-fit: cover;
    width: 100%;
    height: 470px;
}
#main .picBox .btmPhoto {
    width: 40%;
    height: 330px;
	position: relative;
}
#main .picBox .btmPhoto img {
	object-fit: cover;
    width: 100%;
    height: 330px;
}
#main .picBox span.after,
#main .picBox span.before {
    position: absolute;
    top: 0;
    left: 0;
    background: var(--color-black);
    display: inline-block;
    z-index: 10;
    font-size: 15px;
    font-weight: 700;
    color: var(--color-white);
    padding: 3px 10px 2px 10px;
}
#main .picBox span.after {
    background: var(--color-red);
}
#main .picBox span span {
    opacity: 0.5;
    margin-left: 5px;
}
#main .picBox02 {
    margin-top: 40px;
}

/*------------------- #seminar セミナー情報 -----------------*/
#seminar #main {
    padding-bottom: 0;
}
#main .status{
	background: var(--main-color01);
    color: var(--color-white);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    margin-right: 10px;
    padding: 0 10px 1px 10px;
}
#main .status.sbefore{
	background: var(--color-black);
}
#main .status.sin{
	background: var(--color-red);
}
#main .status.safter{
	background: var(--color-gray30);
}
#seminar #main .editorBox{
	justify-content: end;
}
#main .summaryBox{
	display: flex;
	justify-content: space-between;
	gap: 40px;
	align-items: flex-start;
}
#main .seminarImg{
	width: 350px;
	height: 350px;
	padding: 20px;
	background: var(--color-gray05);
	box-sizing: border-box;
}
#main .seminarImg img{
	width: 310px;
	height: 310px;
	object-fit: contain;
    border-color: transparent var(--color-reddark) transparent transparent;
}
#main .summaryBox table{
	flex: 1;
	width: auto;
	margin-top: 0;
}
#main .summaryBox ul,
#main .summaryBox li:last-child{
	margin-bottom: 0;
}
#main .seminarSingle .wysiwyg{
	margin-bottom: 30px;
}
#main .seminarSingle .btnC{
	margin-bottom: 50px;
}
#main .speakerSummary{
	display: flex;
	justify-content: space-between;
	gap: 40px;
	align-items: flex-start;
}
#main .speakerImg{
	width: 350px;
	height: 400px;
	box-sizing: border-box;
}
#main .speakerImg img{
	width: 350px;
	height: 400px;
	object-fit: cover;
}
#main .speakerProf{
	flex: 1;
	width: auto;
}
#main .speakerProf .corp{
	margin-bottom: 0;
}

/*------------------- #request 資料請求 -----------------*/

#request #main {
	padding-bottom: 0 !important;
}
#request table .wpcf7-list-item{
	display: block;
    margin: 0 0 15px 0;
}
#request table td .wpcf7-list-item:last-of-type{
    margin: 0 0 0 0;
}
#request #main .requestBox h3{
	background: var(--main-color06);
	font-size: 26px;
	font-weight: 500;
	margin: 0 0 20px 0;
	padding: 5px 15px 6px 15px;
}
#request #main ul li {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}
#request #main ul li::after,
#request #main ul li::before{
	content: none;	
}
#request #main ul.requestList{
	display: flex;
	gap:30px;
	flex-wrap: wrap;
	justify-content:flex-start;
	margin-bottom: 50px;
}
#request #main ul.requestList li{
	width: calc(25% - 24px);
	padding: 20px;
	box-sizing: border-box;
	border: solid 1px var(--color-gray30);
	background-color: var(--color-gray05);
}
#request #main ul.requestList li .request_thumb{
	width: 100%;
	height: 234px;
	display: flex;
	align-items: center;
	justify-content: center;
}
#request #main ul.requestList li .request_thumb.en{
	background-color: var(--color-white);
	padding: 15px;
	box-sizing: border-box;
	font-size: 20px;
	color: var(--color-gray30);
}
#request #main ul.requestList li img{
	width: 100%;
	height: 234px;
	object-fit: contain;
}
#request #main ul.requestList li p.reqName{
    color: var(--main-color01);
    font-weight: 700;
	margin: 5px 0 0 0;
}
#request #main ul.requestList li p.reqSummary{
    font-size: 14px;
	margin: 5px 0 0 0;
}

/*------------------- #menu 工事メニュー -----------------*/
#mainv.menuTop{
    height: 460px;
}
.menuLead{
	box-sizing: border-box;
	padding: 20px;
    margin: -145px auto 0;
}
.menuLead p {
    text-align: center;
    font-size: 20px;
}
#contents #main section.menuList{
	padding: 50px 0 50px 0;
	background-color: var(--main-color06);
	margin-bottom: 50px;
}
#menu .menuListItem{
	margin-bottom: 60px;
	background-color: var(--color-white);
}
#menu .menuListItem:last-child{
	margin-bottom: 0;
}
#menu .menuListItem a{
	text-decoration: none;
}
#menu .menuListItem a:hover img{
	opacity: 1;
}
#menu .menuListItem a:hover .titBox{
	opacity: 0.8;
	transition: 0.8s;
}
#menu .menuListItem .titBox{
	position: relative;
    height: 300px;
    z-index: 9;
	margin-bottom: 30px;
	background-size: cover;
	box-sizing: border-box;
	padding: 50px 0;
}
#menu .menuListItem .titBox::before {
    content: '';
    background-color: rgba(0, 0, 0, 0.4);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
}
#menu .menuListItem .titBox span.logo {
    background-color: var(--main-grd-deepdark);
    display: block;
    width: 130px;
    height: 130px;
    padding: 20px;
    box-sizing: border-box;
    border-radius: 50vh;
}
#menu .menuListItem .titBox span.logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
#menu .menuListItem .titBox .menuCatch,
#menu .menuListItem .titBox h2{
	position: relative;
	z-index: 10;
	text-align: center;
	margin: 0;
	color: var(--color-white);
    font-weight: 900;
    font-size: 40px;
    line-height: 1;
    text-shadow: 0px 0px 7px var(--main-color01);
}
#menu .menuListItem .titBox h2{
    font-size: 90px;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 30px;
	padding-top: 20px;
    font-weight: 700;
}
#menu .menuListItem .textBox p{
	text-align: center;
}
#menu .menuListItem .textBox .btnC{
    margin-bottom: 30px;
}

/*-- 詳細 --*/
#menu #mainv .textBox{
	width: 100%;
	max-width: 1200px;
	margin-left: 10px;
	margin: 0 auto;
	color: var(--color-white);
    font-weight: 900;
    font-size: 72px;
    line-height: 1.3;
    display: block;
    text-shadow: 0px 0px 7px var(--main-color01);
	z-index: 9;
	position: absolute;
    top: 90px;
    left: 50%;
    transform: translateX(calc(-50% + 55px));
    -webkit-transform: translateX(calc(-50% + 55px));
    -ms-transform: translateX(calc(-50% + 55px));
}
#menu #mainv .textBox h1{
    text-align: center;
    font-size: 130px;
}
#menu #mainv .textBox .menuCatch{
	display: flex;
	gap: 40px;
	align-items: center;
}
#menu #mainv .textBox span.logo{
	background-color: var(--main-grd-deepdark);
	display: block;
	width: 150px;
	height: 150px;
	padding: 20px;
	box-sizing: border-box;
	border-radius: 50vh;
}
#menu #mainv .textBox span.logo img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
#menu #mainv .textBox p{
	flex:1;
}
#menu #mainv .textBox p span{
	display: block;
}
#menu #mainv .textBox p span.catch{
	font-size: 38px;
}
#menu #mainv .textBox p span.siteTit{
	font-size: 60px;
}
#menu #mainv.menuTop .textBox p span.siteTit{
	text-align: center;
}
#menu #mainv::before {
	content: '';
	background-color: rgba(0, 0, 0, 0.4);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: block;
}
.menuContact h4{
    color: var(--main-color01);
    display: inline-block;
    font-weight: 700;
    font-size: 30px;
    margin-left: 30px;
}
.menuContact h4 .tel{
    color: var(--main-color01);
}
#main .menuWorryArea{
	background: url(./img/common/bg_philosophy.png) no-repeat right bottom var(--main-color06);
}
#main .menuWorryArea h2{
	text-align: center;
	color: var(--main-color01);
	margin-bottom: 20px;
	font-weight: 700;
	font-size: 45px;
}
#main .menuWorryArea ul.photoUL{
	margin-bottom: 40px;
}
#main .menuWorryArea ul.photoUL li img{
	width: 100%;
	height: 280px;
	object-fit: cover;
}
#main .menuWorryArea ul li p{
    text-align: center;
    font-size: 25px;
    font-weight: 500;
}
#main .menuWorryArea ul li p span{
	color: var(--main-color01);
}
#main .menuWorryArea .lead p{
	text-align: center;
	font-size: 18px;
}
#menu #main .topWorksArea{
	padding-bottom: 0;
}
#menu #main .topWorksArea h2::first-letter{
    color:var(--main-color01);
}
#menu #main .topWorksArea h2 span.en{
    font-family: 'Poppins', sans-serif;
    font-size: 50px;
    font-weight: 600;
    margin-right: 30px;
}
#menu .menuSolutionArea{
	color: var(--color-white);
	text-align: center;
	overflow: visible;
	padding: 30px 0 70px 0;
	background-color: var(--main-color01);
}
#menu #main .menuSolutionArea{
	padding: 0 0 40px 0;
	background: var(--main-grd-deepdark);
}
#menu .menuSolutionArea .inner{
	overflow: visible;
}
#menu #main .menuSolutionArea h3{
	position: relative;
    background: var(--main-color01);
    display: inline-block;
    border-radius: 50vh;
    font-size: 32px;
    padding: 10px 40px;
	margin: -30px 0 25px 0;
}
#menu .menuSolution{
	font-size: 40px;
    font-weight: 700;
    line-height: 1.4;
	margin-bottom: 0;
}
#menu #main .menuFeatureArea{
	background-color: var(--color-gray05);
	padding-top: 40px;
	margin-bottom: 50px;
}
#menu #main .menuFeatureArea h2{
	text-align: center;
	margin-bottom: 30px;
}
#menu #main .menuFeatureArea li:before{
	content: none;	
}
#menu #main .menuFeatureArea li{
	display: flex;
	align-content: start;
	flex-direction : row-reverse;
	gap: 40px;
	margin: 0 0 40px 0;
	padding: 0;
}
#menu #main .menuFeatureArea li:last-child{
	margin-bottom: 0;
}
#menu #main .menuFeatureArea li .photoBox{
	width: 380px;
}
#menu #main .menuFeatureArea li .photoBox img{
	width: 100%;
	height: 280px;
	object-fit: cover;
}
#menu #main .menuFeatureArea li .textBox{
	flex: 1;
}
#menu #main .menuFeatureArea li .textBox h3{
	background: var(--color-white);
}
#menu #main .menuFeatureArea li .textBox h3::after{
    font-family: 'Poppins', sans-serif;
    font-size: 70px;
    content: counter(my-counter,decimal-leading-zero);
    counter-increment: my-counter;
    color: var(--main-color01);
    display: block;
    float: right;
    text-align: center;
	transform: skewX(-15deg);
}
#menu #main .menuFeatureArea li .textBox p strong{
    position: relative;
    background-image: linear-gradient( transparent 80%,var(-color-marker-y) 80%,var(-color-marker-y) 100%);	
}
#menu #main .menuPriceArea{
	padding: 50px 0;
}
#menu #main .menuPriceArea h2{
	margin-bottom: 30px;
}
#menu #main .menuPriceArea h3{
	display: inline-block;
    background: var(--main-color01);
    color: var(--color-white);
    padding: 5px 80px 5px 50px;
    font-size: 30px;
	position: relative;
}
#menu #main .menuPriceArea h3::after {
    content: '';
    width: 0;
    height: 0;
    border-bottom: 80px solid transparent;
    border-right: 40px solid var(--color-white);
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
}
#menu #main .menuPriceArea li::after,
#menu #main .menuPriceArea li::before{
	content: none;
}
#menu #main .menuPriceArea ul{
	border-bottom: dotted 1px var(--color-black);
	margin-bottom: 50px;
}
#menu #main .menuPriceArea li{
	display: flex;
	box-sizing: border-box;
	padding: 10px;
	margin: 0 auto;
	border: dotted 1px var(--color-black);
	border-bottom: none;
	gap: 30px;
	align-items: center;
	margin: 0;
}
#menu #main .menuPriceArea li .photoBox{
	width: 320px;
}
#menu #main .menuPriceArea li .photoBox img{
	width: 100%;
	height: 200px;
	object-fit: cover;
}
#menu #main .menuPriceArea li .outline p{
	width: 100%;
    margin-bottom: 5px;
	line-height: 1.2;
}
#menu #main .menuPriceArea li .maker{
    font-weight: 700;
    font-size: 20px;
}
#menu #main .menuPriceArea li .maker img{
	height: 40px;
	object-fit: contain;
	object-position: left;
}
#menu #main .menuPriceArea li .item{
    font-weight: 700;
    font-size: 35px;
}
#menu #main .menuPriceArea li p.price{
    font-family: 'Poppins','Noto Sans JP', sans-serif;
	font-weight: 600;
	color: var(--color-red);
    font-size: 70px;
    margin-bottom: 0;
}
#menu #main .menuPriceArea li .price .unit{
    font-size: 30px;
}
#menu #main .menuSmall .menuPriceArea ul{
	display: flex;
	flex-wrap: wrap;
}
#menu #main .menuSmall .menuPriceArea li{
	width: 50%;
	box-sizing: border-box;
}
#menu #main .menuSmall .menuPriceArea li:nth-child(2n){
	border-left: none;
}
#menu #main .menuSmall .menuPriceArea li .photoBox{
		width: 200px;
}
#menu #main .menuSmall .menuPriceArea li .item{
	font-size: 28px;
}
#menu #main .menuSmall .menuPriceArea li p.price{
    font-size: 60px;
}
#menu .menuFtrContact{
	margin: -40px auto 50px;
	padding: 0;
}
#menu .topTroubleArea ul{
	background: none;
    padding-bottom: 0 !important;
    margin-bottom: 0px !important;
}

/*------------------- #reason 選ばれる理由 -----------------*/
#reason #main {
	padding-top: 0;
}
#reason #main .pageLead{
	padding: 60px 0 !important;
	margin-bottom: 0;
	background: url(./img/common/bg_philosophy.png) no-repeat right bottom var(--main-color06);
}
#reason #main .pageLead p{
	text-align: center;
    font-size: 50px;
    font-weight: 700;
    line-height: 1.5;
}
#reason #main .worryArea{
    background: url(./img/top/bg_trouble.jpg) no-repeat top center var(--color-white);
	padding: 10px 0 50px !important;
}
#reason #main .worryArea h2{
    text-align: center;
    color: var(--color-white);
    line-height: 1.2 !important;
    font-size: 46px !important;
    font-weight: 700 !important;
    margin-bottom: 15px;
}
#reason #main .worryArea h2::first-letter{
    color: inherit !important;
}
#reason #main .worryArea h2 .en{
    opacity: 0.08;
    font-size: 110px !important;
    display: block;
    margin-bottom: -55px;
}
#reason #main .worryArea ul{
	width: 80%;
    margin: 0 auto;
    background: var(--color-white);
    padding: 15px 40px 10px 40px;
}
#reason #main .worryArea ul li{
	border-bottom: dotted 1px var(--color-black);
	padding-bottom: 10px;
}
#reason #main .worryArea ul li:before{
	top: 16px;
}
#reason #main .worryArea ul li p{
	font-weight: 500;
	font-size: 22px;
	margin-bottom: 0;
}
#reason #main .worryArea ul li p strong{
	font-weight: 700;
    background-image: linear-gradient( transparent 80%,var(--color-marker-v) 80%,var(--color-marker-v) 100%);
}
#reason #main .reasonSolution{
	background-color: var(--main-color04);
	padding: 25px 0;
	margin-bottom: 50px;
}
#reason #main .reasonSolution p{
	text-align: center;
	color: var(--color-white);
	font-size: 40px;
	font-weight: 700;
    line-height: 1;
	margin: 0;
}
#reason #main .reasonItem{
	background: var(--color-gray05);
    margin: 0 0 60px 0 !important;
	position: relative;
	padding-bottom: 0;
}
#reason #main .reasonItem01{
	background: url(./img/common/bg_reason01.jpg) left top no-repeat var(--color-gray05);
}
#reason #main .reasonItem02{
	background: url(./img/common/bg_reason02.jpg) right top no-repeat var(--color-gray05);	
}
#reason #main .reasonItem03{
	background: url(./img/common/bg_reason03.jpg) left top no-repeat var(--color-gray05);
}
#reason #main .reasonItem01,
#reason #main .reasonItem03{
    margin-right: calc(calc(100% - 1200px) / 2) !important;
}
#reason #main .reasonItem02{
    margin-left: calc(calc(100% - 1200px) / 2) !important;
}
#reason #main .reasonItem .inner{
	overflow: visible;
    box-sizing: border-box;
}
#reason #main .reasonItem01 .inner,
#reason #main .reasonItem03 .inner{
    margin-right: 0 !important;
    padding: 60px 60px 60px 0;
}
#reason #main .reasonItem02 .inner{
    margin-left: 0 !important;
    padding: 60px 0 60px 60px;
}
#reason #main .reasonItem p.label{
	font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 50px;
    position: absolute;
    top: -20px;
    right: 10px;
    line-height: 1;
    border-bottom: solid 3px var(--color-black);
}
#reason #main .reasonItem02 p.label{
	right: unset;
	left: 10px;
}
#reason #main .reasonItem h3{
	margin: 0 0 20px 0;
	font-size: 35px;
	color: var(--main-color01);
}
#reason #main .reasonItem h4{
	font-size: 20px;
    font-weight: 500;
    border-top: solid 2px var(--main-color01);
    border-bottom: solid 2px var(--main-color01);
    margin: 50px 0 20px 0;
    padding: 5px 0 6px 0;
}
#reason #main .worksLogoList{
    margin: 0 auto 30px !important;
    display: flex;
    justify-content:space-between;
    align-items: center;
    overflow: visible;
}
#reason #main .worksLogoList li::after,
#reason #main .worksLogoList li::before,
#reason #main .licenseList li::after,
#reason #main .licenseList li::before,
#reason #main .flow li::before,
#reason #main .flow li::before{
	content: none;
}
#reason #main .worksLogoList li{
	margin: 0;
    width: 200px;
    height: 200px;
    padding: 20px !important;
    border:solid 1px var(--color-gray20);
	background: var(--color-white);
    box-sizing: border-box;
    text-align: center;
}
#reason #main .worksLogoList li img{
    width: 100%;
    height: 160px;
    object-fit: contain;
}
#reason #main .worksLogoList li p{
    width: 100%;
    height: 160px;
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    font-size: 16px;
    font-weight: 500;
}
#reason #main .reasonItem02 h5{
	font-size: 20px;
}
#reason #main .reasonItem02 .btnC{
	clear: both;
}
#reason #main .reasonItem03 ol{
	margin-bottom: 0;
}
#reason #main .reasonItem03 ol li h5{
	display: inline-block;
	font-size: 20px;
	line-height:1;
}
#reason #main .reasonItem03 ol li p strong{
    position: relative;
    background-image: linear-gradient( transparent 80%,var(-color-marker-y) 80%,var(-color-marker-y) 100%);
}
#main .licenseList{
	display: flex;
	justify-content: space-between;
	align-items:flex-start;
	flex-wrap: wrap;
	gap: 40px;
	margin-bottom: 50px;
}
#main .licenseList li{
	display: block;
    width: calc((100% - 80px)/3);
    margin: 0;
    padding: 0;
    font-size: 16px;
	background: var(--main-color01);
	background-image: linear-gradient( 90deg, var(--main-grd-dark) 0%, var(--main-grd-light) 100%);
	border: solid 1px var(--color-white);
	box-sizing: border-box;
	outline: solid 2px var(--main-color01);
	outline-offset: 1px;
	color: var(--color-white);
	font-weight: 700;
	text-align: center;
	padding: 10px 10px 10px 10px;
}
#main .licenseList li p{
	line-height: 1.3;
	margin-bottom: 5px;
}
#main .licenseList li p.lName span:nth-of-type(2){
	font-size: 25px;
	display: block;
}
#main .licenseList li p.lNum span:nth-of-type(1){
	font-family: 'Poppins', sans-serif;
    font-weight: 600;
	font-size: 50px;
}
#main .licenseList li p.lNum span:nth-of-type(2){
	font-size: 30px;
}
#main .reasonItem03 .flow{
	display: flex;
	justify-content: space-between;
	align-items:flex-start;
	position: relative;
}
#main .reasonItem03 .flow li{
	padding: 20px 10px;
	box-sizing: border-box;
	position: relative;
	z-index: 9;
}
#main .reasonItem03 .flow li.step{
	background:var(--main-grd-deepdark);
	color:var(--color-white);
	writing-mode: vertical-rl;
	height: 200px;
	display: flex;
	align-items: center;
	font-size: 20px;
}
#main .reasonItem03 .flow li.num {
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	position: relative;
	display: inline-block;
	margin: 20px 0 0 0;
	padding: 0 5px;
	width: 70px;
	height: 70px;
	line-height: 70px;
	text-align: center;
	color: var(--color-white);
	font-size: 20px;
	font-weight: bold;
	background: var(--main-color01);
	border-radius: 50%;
	box-sizing: border-box;
}
#main .reasonItem03 .flow li.num::before {
	content: '' !important;
	position: absolute;
	bottom: -25px;
	left: 50% !important;
	margin-left: -10px;
	border: 10px solid transparent;
	border-top: 20px solid var(--main-color01);
	z-index: 0;
    top: unset;
    width: unset;
    height:  unset;
    background: unset;
    border-radius:  unset;
}
#main .reasonItem03 .flow::after {
    content: '';
    width: calc(100% - 20px);
    height: 20px;
    background: var(--main-color03);
    position: absolute;
    z-index: 5;
    top: 50%;
    right: 10px;
	margin-top: -10px;
    transform: skewX(-35deg);
}