@charset "utf-8";
/* 
	
CSS base.css */



/*
main #cc0001
sub #79511b
*/




/*//////////////////


Header


//////////////////*/

#header .mainbox{ display: flex; flex-direction: row; justify-content: flex-end; position: fixed; top: 0; left: 0; z-index: 1000; width: 100%; padding-right: 190px; padding-top: 50px; box-sizing: border-box; }
#header .mainbox>.sitetitlebox{ position: absolute; top: 60px; left:10%; }
#index #header .mainbox>.sitetitlebox{ top: 280px }
#header .mainbox>.sitetitlebox>a{ text-decoration: none; }
#header .mainbox>.sitetitlebox .logo{ width: 340px; height: 54px; transition: .3s }
#header .mainbox>.sitetitlebox .cap{ line-height: 1.4; margin-top: 25px; padding-left: 5px; transition: .3s }
#header .rightbox{  }
#header .rightbox .contactlist{  }
#header .rightbox .contactlist>ul{  }
#header .rightbox .contactlist>ul>li{  }
#header .rightbox .contactlist>ul>li>a{  }
#header .rightbox .contactlist>ul>li>a>svg{  }
#header .rightbox{  }
#index #header.fixed .sitetitlebox{ top: 60px; position: fixed; }
#index #header.fixed .sitetitlebox .logo{ width: 212px; height: 34px }
#index #header.fixed .sitetitlebox .cap{ font-size: 1.4rem; margin-top: 15px }

body:not(#index) #header .mainbox>.sitetitlebox{ left: 4%; top: 50px }
body:not(#index) #header .mainbox>.sitetitlebox .logo{ width: 212px; height: 34px; }
body:not(#index) #header .mainbox>.sitetitlebox .cap{ display: none }
@media screen and (max-width: 1040px) {
	#header .mainbox,
	#header .mainbox>.sitetitlebox{ position: static!important; }
	#header .sitetitlebox .logo{ width: 212px!important; height: 34px!important }
	#header .mainbox{ justify-content: space-between; padding-left: 4%; height: 150px; align-items: center; padding-top: 0 }
	#header .mainbox>.sitetitlebox .cap{ margin-top: 15px }
	#header .rightbox .contactlist{ display: none; }
}
@media screen and (max-width: 767px) {
	#header .sitetitlebox .logo{ width: 190px!important; height: 30px!important }
	#header .mainbox>.sitetitlebox .cap{ font-size: 1.2rem }
	#header .mainbox{ height: 100px }
}
@media screen and (max-width: 479px) {
	#header .mainbox>.sitetitlebox .cap{ display: none; }
	#header .mainbox{ height: 80px }
	#header .sitetitlebox .logo{ width: 150px!important; height: 32px!important }
}

/* スライド画像のエフェクト */
@keyframes navfit {
  0% { transform: translate(0px, -50px); }
  100% { transform: translate(0px, 0px);  }
}






/*//////////////////


Nav


//////////////////*/

#gnav{  z-index: 100000000; opacity: 0; position: fixed; top: 0; bottom: 0; left: 0; right: 0; height: 100vh!important; display: block; overflow: hidden; width: 100vw!important; visibility: hidden;  }
#gnav .navbox{ position: relative; z-index: 10; display: flex; flex-direction: row; }
#gnav>.scrollcover{  }

.navlist{  }
#gnav.navlist .incnt>.mainlistcover{ display: flex; flex-direction: column; justify-content: center; height: 100vh; width: 100% }
#gnav.navlist .incnt>.mainlistcover>.inwrap{ overflow: hidden; padding-top: 150px; padding-bottom: 120px; }
#gnav.navlist .incnt>.mainlistcover>.inwrap>.inwrap{ overflow-y: scroll; height: calc(100vh - 270px);  /* Safari用 */ width: calc(100% + 20px); padding: 0 2%; box-sizing: border-box; }
#gnav.navlist .incnt>.mainlistcover>.inwrap>.inwrap>.inwrap{ display: flex; flex-direction: row; justify-content: space-between; padding-right: 10%; align-items: flex-end; }

#gnav.navlist ._nav,
#gnav.navlist ._casestudy{  transition: 3s; opacity: 0 }

#gnav.navlist ._nav{ width: 50%;  }
#gnav.navlist ._nav .sitetitlebox{ position: absolute; top: 60px; left:2%; }
#gnav.navlist ._nav .sitetitlebox .logo{ width: 244px; height: 40px; }
#gnav.navlist ._nav .mainlist{  }
#gnav.navlist ._nav .mainlist>li:last-child{ margin-bottom: 0 }
#gnav.navlist ._nav .mainlist>li>a{ text-decoration: none; }
#gnav.navlist ._nav .mainlist>li>a:hover{ color: #0096e5 }
#gnav.navlist ._nav .mainlist>li>a>span{ font-weight: bold; font-size: 3.2rem; line-height: 1.6;  }
#gnav.navlist ._nav .contactlist3{ margin-top: 40px; }

#gnav.navlist ._casestudy{ width: 46%; flex-shrink: 0; }
#gnav.navlist ._casestudy>.title{ font-weight: bold; font-size: 3.2rem; line-height: 1.6; margin-bottom: 30px }
#gnav.navlist ._casestudy .casestudylist .imgbox{ width: 140px; }
#gnav.navlist ._casestudy .casestudylist .txtbox{ min-height: 150px; padding-bottom: 0; justify-content: flex-start; margin-bottom: -10px }
#gnav.navlist ._casestudy .casestudylist .txtbox  .linktxt{ margin-top: 0 }
#gnav.navlist ._casestudy .casestudylist>li{ margin-bottom: 25px }


#gnav .bg{  }
#gnav .bg .whitebg{ position: absolute; left: 0; top: 0; width: 100vw; height: 100vh; z-index: 2; background-color: #fff; opacity: 0; visibility: hidden; transition: all .6s; cursor: pointer; }

#gnav.is-open{ opacity: 1; visibility: visible; }
#gnav.is-open .whitebg{ opacity: 1; visibility: visible; }

#gnav.navlist.is-open ._nav,
#gnav.navlist.is-open ._casestudy { opacity:1; transition: 3s; }

@media screen and (max-width: 1040px){
	#gnav .logo{ margin-left: 0; }
	#gnav.navlist .incnt>.mainlistcover>.inwrap>.inwrap>.inwrap{ display: block; padding-right: 0; }
	#gnav.navlist ._nav{ padding-top: 0; width: 100%;  }
	#gnav.navlist ._casestudy{ width: 100%; flex-shrink: 0; margin-top: 100px }
	#gnav.navlist .incnt>.mainlistcover>.inwrap{ padding-top: 150px; padding-bottom: 0; }
	#gnav.navlist .incnt>.mainlistcover{ display: block; }
	#gnav.navlist ._nav .mainlist>li>a>span,
	#gnav.navlist ._casestudy>.title{ font-size: 2.4rem }
	#gnav.navlist .incnt>.mainlistcover>.inwrap>.inwrap{ height: calc(100vh - 150px) }
	#gnav.navlist ._nav .contactlist3>li._tel>.inwrap .txt .link{ font-size: 2.4rem; vertical-align: 2px }
	#gnav.navlist ._nav .contactlist3>li._tel>.inwrap .txt .opentime{ vertical-align: 5px; font-size: 1.4rem }
	#gnav.navlist ._casestudy{ margin-top: 80px; padding-bottom: 100px }

}
@media screen and (max-width: 767px){
	#gnav.navlist .incnt>.mainlistcover>.inwrap{ padding-top: 100px }
	#gnav.navlist ._nav .sitetitlebox{ top: 30px }
	#gnav.navlist ._casestudy{ margin-top: 60px; padding-bottom: 0 }
	#gnav.navlist ._casestudy>.title{ margin-bottom: 20px }
}
@media screen and (max-width: 639px){
}
@media screen and (max-width: 479px){
	#gnav.navlist ._nav .sitetitlebox{ top: 25px; left: 0 }
	#gnav.navlist .incnt>.mainlistcover>.inwrap{ padding-top: 90px }
	#gnav.navlist ._casestudy .casestudylist .imgbox{ width: 100px }
}





/*//////////////////


Menubtn


//////////////////*/

#menubtn { z-index: 100000001; position: fixed; top: 50px; right: 60px; display: block; background: transparent; height: 60px; cursor: pointer; }
#menubtn a { text-decoration: none; position: relative; height: 100%; width: 100%;  }
#menubtn a .linebox{ position: relative; width: 70px; height: 30px; margin-left: 15px; display: inline-block; vertical-align: middle; }
#menubtn a .linebox .line { height: 4px; background: #141312; position: absolute; transition: all 0.6s; left: 0; }
#menubtn a #line1 { top: 5px; width: 70px;  }
#menubtn a #line2 { bottom: 7px; width: 70px;  }
#menubtn.active a{ }
#menubtn.active a .closetxt  { opacity: 1; visibility: visible; display: inline-block; }
#menubtn.active a .linebox{ }
#menubtn.active a .line {  }
#menubtn.active a #line1 {

	-webkit-transform:translateY(7px) translateX(0) rotate(20deg);
	transform:translateY(7px) translateX(0) rotate(20deg);
}
#menubtn.active a #line2 { 
	-webkit-transform:translateY(-7px) translateX(0) rotate(-20deg); 
	transform:translateY(-7px) translateX(0) rotate(-20deg);
}
@media screen and (max-width: 1040px){
}
@media screen and (max-width: 767px){
	#menubtn { top: 30px; right: 30px; height: 25px; }
	#menubtn a .linebox{ width: 50px; height: 25px; margin-left: 15px; }
	#menubtn a .linebox .line { height: 2px; }
	#menubtn a #line1 { top: 5px; width: 50px;  }
	#menubtn a #line2 { bottom: 7px; width: 50px;  }
	#menubtn.active a #line1 {
		-webkit-transform:translateY(6px) translateX(0) rotate(20deg);
		transform:translateY(6px) translateX(0) rotate(20deg);
	}
	#menubtn.active a #line2 { 
		-webkit-transform:translateY(-6px) translateX(0) rotate(-20deg); 
		transform:translateY(-6px) translateX(0) rotate(-20deg);
	}
}
@media screen and (max-width: 479px){
	#menubtn{ top: 25px }
}




/*//////////////////


Mainv_index


//////////////////*/
#mainv_index{ position: relative; height: 100vh; min-height: 900px; background: #f5f5f5; z-index: 10 }
#mainv_index .txtbox{ height: 100%; position: relative; z-index: 100; padding-top: 170px; box-sizing: border-box; }
#mainv_index .txtbox>.incnt{ max-width: 1230px; width: 92%; text-align: right; height: 100% }
#mainv_index .txtbox>.incnt>.inwrap{ height: 100%; display: flex; align-items: center; justify-content: flex-end; }
#mainv_index .txtbox>.incnt>.inwrap>.inwrap{ display: inline-block; text-align: left; }
#mainv_index .txtbox .messagetxt{ width: 702px; height: 154px; margin-bottom: 10px }
#mainv_index .txtbox .copy{ font-weight: 900; font-size: 2.8rem; padding-left: 20px }
#mainv_index .bg{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 10; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 89%); }
#mainv_index .bg img{ width: 100%; height: 100%; object-fit: cover; font-family: 'object-fit: cover;';  }
#mainv_index .bg img.ieonly{ display: none; }
#mainv_index .sankakubg{ width: 0; height: 0; border-style: solid; border-width: 650px 600px 0 0; border-color: #ffffff transparent transparent transparent; position: absolute; bottom: -460px; left:0; }
#scrollbox{ position: absolute; right: 80px; bottom: -40px; display: flex; flex-direction: row-reverse; z-index: 1000 }
#scrollbox .scrolltxt{ margin-left: 5px; font-size: 1.4rem }
#scrollbox .arr{ position: relative; overflow: hidden; height: 118px; width: 20px }
#scrollbox .arr:before{ content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin-left: auto; margin-right: auto; width: 2px; height: 100%; background: #1a1a1a; }
#scrollbox .round{ width: 20px; height: 20px; border-radius: 50%; border: 5px solid #191919; position: absolute; top: 0; left: 0; right: 0; margin-left: auto; margin-right: auto; background: #fff; box-sizing: border-box; -webkit-animation: sdl 4s ease-out infinite; animation: sdl 4s ease-out infinite; }
@keyframes sdl {
  0% { transform: translate(0, -20px) scale(0.5); }
  40% { transform: translate(0, 60px) scale(1); }
  80% { transform: translate(0, 118px) scale(0.5); }
  100% { transform:  translate(0, 118px) scale(0.5); }
}
@media screen and (max-width: 1040px){
	#mainv_index{ /*margin-top: 100px;*/ height: 600px!important; min-height: auto!important; }
	#mainv_index .txtbox .messagetxt{ width: 600px; height: auto; margin-bottom: 10px }
	#mainv_index .txtbox .copy{ font-size: 2.4rem; }
	#mainv_index .txtbox{ padding-top: 0 }
}
@media screen and (max-width: 767px){
	#mainv_index{ height: 460px!important; }
	#mainv_index .txtbox .messagetxt{ max-width: 400px; height: auto; width: 100% }
	#mainv_index .txtbox .copy{ font-size: 2rem; }
	#mainv_index .txtbox>.incnt>.inwrap{ justify-content: center; }
	#scrollbox{ display: none; }
}
@media screen and (max-width: 479px){
	#mainv_index{ height: 360px!important; }
	#mainv_index .txtbox .copy{ font-size: 1.8rem; padding-left: 0 }
}

#index #secwrap_1{ padding: 0 }


/*//////////////////


mainv


//////////////////*/
#mainv{ margin-bottom: 90px; position: relative; padding-top: 250px }
#mainv:before{ content: ""; width: 0; height: 0; border-style: solid; border-width: 384px 4614px 384px 0; border-color: transparent #f5f5f5 transparent transparent; position: absolute; top: 0px; right: -1%; display: block; transform: rotate(1.5deg); z-index: -1 }
#mainv>.incnt{  }
#mainv>.incnt>.pagetitlebox{  }
#mainv .pagetitlebox{ margin-left: -20px }
#mainv .pagetitlebox .entitle{ display: inline-block; vertical-align: super; margin-left: 20px; font-weight: bold; font-size: 6rem }
#mainv .pagetitlebox .jntitle{ display: inline-block; vertical-align: text-bottom; margin-left: 20px; font-weight: bold; font-size: 1.8rem }
@media screen and (max-width: 1200px) {
	#mainv:before{ right: -10%; }
}
@media screen and (max-width: 1040px) {
	#mainv{ padding-top: 50px }
	#mainv:before{ border-width: 192px 2307px 192px 0; bottom: 0; margin-top: auto; margin-bottom: auto; }
	#mainv .pagetitlebox .entitle{ font-size: 4.5rem }
}
@media screen and (max-width: 767px) {
	#mainv:before{ border-width: 128px 1538px 128px 0; right: -1%; }
	#mainv .pagetitlebox .entitle{ font-size: 3rem }
	#mainv .pagetitlebox .jntitle{ font-size: 1.6rem }
}
@media screen and (max-width: 479px){
	#mainv .pagetitlebox{ margin-left: 0 }
	#mainv .pagetitlebox .entitle{ display: block; margin-left: 0; }
	#mainv .pagetitlebox .jntitle{ display: block; margin-left: 0; }
}




#pankuzu {  }
#pankuzu ol li { display:inline; }
#pankuzu ol li:after { content: ">"; margin-right: 12px; vertical-align: 0px; margin-left: 17px }
#pankuzu ol li:last-child:after{ content: none }
#pankuzu ol li a{ letter-spacing: 0.1em }
#pankuzu ol li a:hover { opacity: 0.7; transition: 0.3s; }
@media screen and (max-width: 1040px){
	#pankuzu{ display: none; }
}



/*//////////////////


main


//////////////////*/
#main{ margin-top: 160px; padding-bottom: 200px; }
#main #secwrap_1{ padding-top: 0; padding-bottom: 0;  }
@media screen and (max-width: 1040px) {
	#main{ margin-top: 0;  padding-bottom: 150px; }
}
@media screen and (max-width: 767px) { 
	#main{ padding-bottom: 100px; }
}
@media screen and (max-width: 479px){
}

#casestudypagecopy{  }
#casestudypagecopy>.incnt{  }
#casestudypagecopy>.incnt>.inwrap{ display: flex; flex-direction: row; justify-content: space-between; }
#casestudypagecopy .titlebox{ flex-shrink: 0; margin-right: 40px }
#casestudypagecopy .titlebox .jntitle{ font-weight: 900; font-size: 2.8rem; line-height: 1.4; margin-bottom: 20px }
#casestudypagecopy .titlebox .entitle{ font-weight: bold; letter-spacing: 0.1em }
#casestudypagecopy .txt{ width: 56.6%; }
@media screen and (max-width: 1040px) {
	#casestudypagecopy>.incnt>.inwrap{ display: block; }
	#casestudypagecopy .titlebox{ margin-right: 0; margin-bottom: 40px }
	#casestudypagecopy .txt{ width: 100%; }
	#casestudypagecopy .titlebox .jntitle{ font-size: 2.4rem; margin-bottom: 10px }
}
@media screen and (max-width: 767px) { 
	#casestudypagecopy .titlebox .jntitle{ font-size: 2rem }
}
@media screen and (max-width: 479px){
}

#yokomain{  }
#yokomain>.incnt{  }
#yokomain>.incnt>.inwrap{ display: flex; flex-direction: row-reverse; }
#yokomain>.incnt>.inwrap #secwrap_1{ width: 100% }
#yokomain #sidebox{ width: 340px; margin-right: 6%; flex-shrink: 0 }
#yokomain #sidebox .csbox{ margin-bottom: 50px }
#yokomain #sidebox .csbox:last-child{ margin-bottom: 0 }
#yokomain #sidebox{  }
#yokomain #sidebox .newslist>li{ border-bottom: 1px solid #191919; padding-bottom: 10px; margin-bottom: 20px }
#yokomain #sidebox .newslist>li:last-child{ border-bottom: 0; padding-bottom: 0; margin-bottom: 0 }
#yokomain #sidebox .newslist>li dl>dd{ color: #191919; font-weight: normal; }
@media screen and (max-width: 1040px) {
	#yokomain>.incnt>.inwrap{ display: block; }
	#yokomain #sidebox{ width: 100%; margin-right: 0; margin-top: 60px }
}
@media screen and (max-width: 767px) { 
}
@media screen and (max-width: 479px){
}

#casestudysinglebox{ margin-bottom: 60px }
#casestudysinglebox .copytxt{ margin-bottom: 50px; }
#casestudysinglebox .singleinfo{  }
#casestudysinglebox .categorylist{ margin-top: 30px }
#casestudysinglebox .categorytxt{ font-size: 1.4rem; margin-bottom: 5px }
@media screen and (max-width: 1040px) {
}
@media screen and (max-width: 767px) { 
	#casestudysinglebox .copytxt{ margin-bottom: 30px; }
}
@media screen and (max-width: 479px){
}




#businesscasestudybox{  }
#businesscasestudybox .box1{ background: #0096e5; padding: 100px 8% 85px; color: #fff; }
#businesscasestudybox .box1 .titlebox{ margin-bottom: 35px; letter-spacing: 0.1em }
#businesscasestudybox .box1 .titlebox .entitle{  font-weight: bold; font-size: 4.8rem; line-height: 1.4; text-align: center; }
#businesscasestudybox .box1 .titlebox .jntitle{ text-align: center; font-weight: bold; font-size: 1.8rem }
#businesscasestudybox .box1 .txt{ text-align: center; font-size: 1.8rem; margin-bottom: 40px }
#businesscasestudybox .box1 .link{ text-align: center;  }
#businesscasestudybox .box1 .link .btnlink{ max-width: 280px; width: 100%; box-sizing: border-box; }
#businesscasestudybox._1 .box1{ padding: 57px 8% 70px }
#businesscasestudybox._1 .box1 .titlebox{ margin-bottom: 25px }
#businesscasestudybox._1 .box1 .link .btnlink{ max-width: 360px }
@media screen and (max-width: 1040px){
	#businesscasestudybox .box1{ padding: 80px 8% 65px; }
	#businesscasestudybox .box1 .titlebox .entitle{ font-size: 3.8rem; }
}
@media screen and (max-width: 767px) {
	#businesscasestudybox .box1{ padding: 60px 8% 45px; }
	#businesscasestudybox .box1 .titlebox{ margin-bottom: 25px }
	#businesscasestudybox .box1 .titlebox .entitle{ font-size: 2.8rem; }
	#businesscasestudybox .box1 .titlebox .jntitle{ font-size: 1.6rem }
	#businesscasestudybox .box1 .txt{ font-size: 1.6rem; margin-bottom: 30px }
}
@media screen and (max-width: 639px){
}
@media screen and (max-width: 479px){
	#businesscasestudybox .box1 .titlebox .jntitle,
	#businesscasestudybox .box1 .txt{ text-align: left; }
}


#recruitmentinterviewlist{  }
#recruitmentinterviewlist .txt{  }
#recruitmentinterviewlist .list{ display: flex; flex-direction: row; justify-content: space-between; margin-left: -100px }
#recruitmentinterviewlist .list>li{ margin-left: 100px; padding-right: 20px; box-sizing: border-box; padding-bottom: 40px; position: relative; width: calc(50% - 100px) }
#recruitmentinterviewlist .list>li>a{ text-decoration: none; }
#recruitmentinterviewlist .list>li .img img{ transition: .3s }
#recruitmentinterviewlist .list>li>a:hover .img img{ opacity: 0.7 }
#recruitmentinterviewlist .list>li .bordercustombox{ position: absolute; right: 0; bottom: 0; background: #fff; width: 56%; padding: 48px 6%!important }
#recruitmentinterviewlist .list>li .bordercustombox:before,
#recruitmentinterviewlist .list>li .bordercustombox>.inwrap:before{ top: -1px; right: -1px; }
#recruitmentinterviewlist .list>li .bordercustombox:after,
#recruitmentinterviewlist .list>li .bordercustombox>.inwrap:after{ bottom: -1px; left: -1px; }
#recruitmentinterviewlist .list>li .bordercustombox>.inwrap{  }
#recruitmentinterviewlist .list>li .bordercustombox .title{ font-weight: bold; font-size: 1.8rem; text-align: left; }
#recruitmentinterviewlist .list>li .bordercustombox .name{ margin-top: 25px }
@media screen and (max-width: 1200px){
	#recruitmentinterviewlist .list{ margin-left: -80px }
	#recruitmentinterviewlist .list>li{ padding-right: 0; padding-bottom: 0; margin-left: 80px; width: calc(50% - 80px) }
	#recruitmentinterviewlist .list>li .img{  }
	#recruitmentinterviewlist .list>li .bordercustombox{ position: relative; width: 100%; padding: 40px 6%!important; margin-top: 30px; box-sizing: border-box; }
}
@media screen and (max-width: 1040px){
	#recruitmentinterviewlist .list{ margin-left: -60px }
	#recruitmentinterviewlist .list>li{ margin-left: 60px; width: calc(50% - 60px) }
}
@media screen and (max-width: 767px) {
	#recruitmentinterviewlist .list{ display: block; margin-left: 0 }
	#recruitmentinterviewlist .list>li{ margin-left: 0; margin-bottom: 40px; width: 100%; }
	#recruitmentinterviewlist .list>li:last-child{ margin-bottom: 0 }
	#recruitmentinterviewlist .list>li .bordercustombox{ padding: 40px 8%!important; }
}
@media screen and (max-width: 639px){
}
@media screen and (max-width: 479px){
}


/*//////////////////


Footer


//////////////////*/

#frecruitbnr{ background: #f5f5f5; padding: 106px 0 100px; }
#frecruitbnr>.incnt{  }
#frecruitbnr .copy{ margin-left: -20px; margin-bottom: 0; text-align: center; }
#frecruitbnr .copy>img{ width: 414px; height: 104px; vertical-align: middle; margin-left: 20px; display: inline-block; margin-bottom: 25px }
#frecruitbnr .copy>.inwrap{ font-weight: 900; font-size: 2.4rem; line-height: 1.6; vertical-align: middle; margin-left: 20px; display: inline-block; margin-bottom: 25px }
#frecruitbnr .link{ text-align: center; }
#frecruitbnr .link .btnlink{ max-width: 360px; width: 100% }
@media screen and (max-width: 1040px){
}
@media screen and (max-width: 767px) { 
	#frecruitbnr{ padding: 60px 0; }
	#frecruitbnr .copy>img{ max-width: 207px; width: 100%; height: auto; }
	#frecruitbnr .copy>.inwrap{ font-size: 2rem }
	#frecruitbnr .link .btnlink{ max-width: 280px }
}
@media screen and (max-width: 639px){
}
@media screen and (max-width: 479px){
}



#fcontact{ position: relative; height: 613px; box-sizing: border-box; }
#fcontact .mainbox{ height: 100% }
#fcontact .mainbox>.incnt{ height: 100% }
#fcontact .mainbox>.incnt>.inwrap{ display: flex; align-items: center; justify-content: center; flex-direction: column; height: 100% }
#fcontact .title{ color: #fff; font-weight: bold; font-size: 4.8rem; line-height: 1.4; margin-bottom: 10px; text-align: center; }
#fcontact .txt{ color: #fff; text-align: center; font-weight: bold; font-size: 1.8rem; margin-bottom: 40px }
#fcontact .bg{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; font-family: 'object-fit: cover;'; z-index: -1 }
@media screen and (max-width: 1040px){
	#fcontact{ height: auto; padding: 100px 0 }
	#fcontact .title{ font-size: 3.8rem }
	#fcontact .mainbox>.incnt>.inwrap{  }
}
@media screen and (max-width: 767px) { 
	#fcontact{ height: auto; padding: 70px 0 80px }
	#fcontact .title{ font-size: 2.8rem }
	#fcontact .txt{ font-size: 1.6rem }
}
@media screen and (max-width: 639px){
	#fcontact .txt{ text-align: left; }
}
@media screen and (max-width: 479px){
}



#fnav{ background: #f5f5f5; padding: 70px 0 75px }
#fnav .mainlist{ display: flex; flex-direction: row; justify-content: space-between; }
#fnav .mainlist>li{ max-width: 250px; }
#fnav .mainlist .list>li a{ text-decoration: none; }
#fnav .mainlist .list>li a:hover{ color: #0096e5; }
#fnav .mainlist .list>li>p,
#fnav .mainlist .list>li>a{ display: inline; }
#fnav .mainlist .list>li>p,
#fnav .mainlist .list>li>a,
#fnav .mainlist .list>li>p>a{ font-weight: bold; }
#fnav .mainlist .sublist{ text-align: left; }
#fnav .mainlist .sublist>li{  }
#fnav .mainlist .sublist>li:before{ content: "・"; }
@media screen and (max-width: 1040px){
	#fnav{ display: none; }
}
@media screen and (max-width: 767px) { 
}
@media screen and (max-width: 639px){
}
@media screen and (max-width: 479px){
}




#footer{ padding: 110px 0 100px }
#footer>.incnt{ max-width: 1400px }
#footer .footermain{ display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
#footer .footermain .mainbox{ align-items: center; display: flex; margin-left: -70px }
#footer .footermain .mainbox .sitetitlebox{ margin-left: 70px; margin-bottom: 15px }
#footer .footermain .mainbox .sitetitlebox>a{ text-decoration: none; }
#footer .footermain .mainbox .sitetitlebox .cap{ margin-bottom: 15px }
#footer .footermain .mainbox .sitetitlebox .logo{  }
#footer .footermain .mainbox .sitetitlebox .logo>img{ width: 226px; height: 36px; }
#footer .footermain .mainbox .addresstxt{ margin-left: 70px; letter-spacing: 0.05em }
#footer .footermain .mainbox+#cr{ margin-left: 30px; font-weight: bold; letter-spacing: 0.08em; text-align: right; }
@media screen and (max-width: 1040px){
	#footer .footermain{ display: block; }
	#footer .footermain .mainbox{ margin-left: 0; display: block; margin-bottom: 40px }
	#footer .footermain .mainbox .sitetitlebox{ margin-left: 0; margin-bottom: 30px; text-align: center; }
	#footer .footermain .mainbox .addresstxt{ margin-left: 0; text-align: center; }
	#footer .footermain .mainbox+#cr{ margin-left: 0; text-align: center; }
}
@media screen and (max-width: 767px) { 
	#footer{ height: auto; padding: 60px 0 40px }
}
@media screen and (max-width: 639px){
}
@media screen and (max-width: 479px){
}