@charset "utf-8";
/* 
	
CSS base.css */



/* 
base : #0d0d0d
blue : #009ed0
bggrey : #f7f7f7
red : #BD0A0F

*/


/*//////////////////


Header


//////////////////*/

#header { width: calc(100% - 380px); margin: 0 340px 0 40px; z-index: 100; padding-right:130px; }
#header .mainbox { display: flex; align-items: center; justify-content: space-between; height: 130px; }
#header .logo { line-height: 0; }
#header .logo img { width: 182px; }
#header .cap { font-size: 14px; line-height: 1.8; flex: 1 0 auto; margin-left:20px; }
#header .hnav { text-align: center; margin-right: 30px; }
#header .hnav .title { font-size: 14px; margin-top: 15px; }
#header .hnav a { font-size: 18px; font-weight: bold; text-decoration: none; }
#header .hnav a:first-child:before { content:"/"; margin: 0 10px; }
#header .cnav { position:fixed; right:130px; top:0; z-index:1; width:210px; }
#header .cnav li { width:100%; height: 65px; }
#header .cnav li a { display:flex; width:100%; height:100%; font-weight:bold; text-decoration:none; justify-content:center; align-items: center; }
#header .cnav li:first-child a { background:#009ed0; color:#fff; }
#header .cnav li:first-child a img { width: 22px; height: 18px; margin-right: 5px; }
#header .cnav li:first-child a span { font-weight: bold;}
#header .cnav li:first-child a:hover { background: #0d0d0d; }
#header .cnav li:last-child a { background: #f5f5f5; color: #0d0d0d; text-align: center; width: 100%; flex-wrap: wrap; }
#header .cnav li:last-child a .title { font-size: 14px; width: 100%; line-height:1; margin-bottom:-12px;}
#header .cnav li:last-child a img { width: 15px; height: 20px; margin-right: 3px; }
#header .cnav li:last-child a span { font-size: 25px; line-height:1 }
/* スクロール時fixed */
#header.fixed { position: fixed; top: 0; background: #fff; background: rgba(255,255,255,0.97); animation: navfit 0.5s ease-out 0s 1 normal both; }
#header.fixed .mainbox { height: 80px; }
#header.fixed .logo img { width: 180px; }
@media screen and (max-width: 1280px) {
	#header .cap { display: none; }
}
@media screen and (max-width: 1040px) {
	#header { width: 100%; margin:0; padding:0: }
	#header .logo { margin-left:4%; }
	#header .logo img { width: 140px; }
	#header,
	#header .mainbox { height: 90px; }
	#header .hnav,
	#header .cnav { display:none; }
}
@media screen and (max-width: 767px) {
	#header,
	#header .mainbox { height: 90px; }
	#header .logo { margin-left:20px; }
	#header .logo img { width: 140px; }
}
@media screen and (max-width: 500px) {
	#header,
	#header .mainbox { height: 80px; }
	#header .logo img { width: 130px; }
}
/* スクロール時fixedのアニメーション */
@keyframes navfit {
  0% { transform: translate(0px, -50px); }
  100% { transform: translate(0px, 0px);  }
}







/*//////////////////


Nav


//////////////////*/

#gnav {z-index: 10002;opacity: 0;position: fixed;top: 0;bottom: 0;left: 0;right: 0;height: 100%; width: 100vw!important;pointer-events: none;display: block;/* height: -webkit-fill-available; height: calc(var(--vh, 1vh) * 100); */ overflow-y: scroll; -ms-overflow-style: none; scrollbar-width: none; }
#gnav::-webkit-scrollbar { display: none; }
#gnav .navbox { display: flex; flex-direction:column; justify-content:center; width: 100%; margin: -20px auto 0; height: 100%; box-sizing:border-box; }
#gnav.is-open{ pointer-events: auto; animation: bgfadein 0.6s ease-out 0.5s 1 normal both; }
.navbg { position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; z-index: 10000; background: #fff; opacity: 1; visibility: hidden; cursor: default; box-sizing: border-box; animation: bgfadeout 1.0s ease-out 0.3s 1 normal both; }
.navbg.is-open{ pointer-events: auto; animation: bgfadein 0.3s ease-out 0s 1 normal both; visibility: visible; }

#gnav ul.topiclist { display: flex; justify-content:center; align-items:center; flex-wrap:wrap; width:100%; }
#gnav ul.topiclist li { display:inline-block; }
#gnav ul.topiclist li a { display: flex; justify-content:center; align-items:center; text-decoration:none; text-align:center; }
#gnav ul.topiclist li a img { width:48px; height:48px; margin-left:15px; }
#gnav ul.topiclist li:first-child a:after { content:url(../img/common/slash.svg); width: 70px; display:block; margin:0 40px; margin-top:20px; }
#gnav ul.topiclist li:first-child a img { margin-right:15px; }
#gnav ul.topiclist li a span { font-weight:bold; display:inline-block; }
#gnav ul.topiclist li a>span>span { font-size:3.6rem; }

#gnav ul.mainlist { display: flex; align-items: center; justify-content:center; margin: 70px 0; }
#gnav ul.mainlist li { display: flex; align-items: center; margin-left:30px; }
#gnav ul.mainlist li:first-child { margin-left:0; }
#gnav ul.mainlist li a { text-decoration:none; font-size: 1.8rem; }
#gnav ul.mainlist li a span { font-weight:bold; }

#gnav .inbox { text-align: center; }
#gnav .inbox .title { font-size:1.8rem; }
#gnav .inbox ul.contactlist { display: flex; justify-content:center; align-items:center; flex-wrap:wrap; width:100%; margin-top:20px; }
#gnav .inbox ul.contactlist li { margin-left:40px; display:inline-block }
#gnav .inbox ul.contactlist li a { text-decoration: none; }
#gnav .inbox ul.contactlist li:first-child { margin-left:0; }
#gnav .inbox ul.contactlist li.online { font-size: 1.8rem; font-weight: bold; position:relative; padding: 5px 0; }
#gnav .inbox ul.contactlist li.online:before,
#gnav .inbox ul.contactlist li.online:after { content:""; height:2px; background:#0d0d0d; width: 100%; position:absolute; top: 0; left:0; }
#gnav .inbox ul.contactlist li.online:after { top: auto; bottom:0; }
#gnav .inbox ul.contactlist li.tel a { font-size: 4.3rem; font-weight: bold; font-family: 'Roboto Condensed', sans-serif; line-height:1; }
#gnav .inbox ul.contactlist li.tel p { font-size: 1.4rem; ; }
#gnav .inbox ul.contactlist li.tel a img { width:25px; height:34px; margin-right:3px; margin-top:-4px; }
#gnav .inbox ul.contactlist li.contact { }
#gnav .inbox ul.contactlist li.contact a { display: flex; justify-content:center; align-items:center; font-size: 2.8rem; padding:0px 40px 5px; font-weight: bold; font-family: 'Oswald', sans-serif; border:3px solid #0d0d0d; border-radius:40px; }
#gnav .inbox ul.contactlist li.contact a img { width:24px; height:20px; margin-right:8px; margin-top:7px; }
@keyframes bgfadein {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes bgfadeout {
  0% { opacity: 1; visibility: visible; }
  100% { opacity: 0; visibility: hidden; }
}
@media screen and (max-width: 1040px){
	#gnav ul.topiclist li a img { width:36px; height:36px; margin-left:10px; }
	#gnav ul.topiclist li:first-child a:after { width: 50px; margin:0 20px; }
	#gnav ul.topiclist li:first-child a img { margin-right:10px; }
	#gnav ul.topiclist li a span { font-size:1.4rem; line-height: 1.8; }
	#gnav ul.topiclist li a>span>span { font-size:2.8rem; }
	
	#gnav ul.mainlist { flex-wrap:wrap; }
	#gnav ul.mainlist li { margin-left:20px; }
	
	#gnav .inbox .title { font-size:1.6rem; }
	#gnav .inbox ul.contactlist li { margin-left:30px; }
	#gnav .inbox ul.contactlist li.online { font-size: 1.6rem; }
	#gnav .inbox ul.contactlist li.tel a { font-size: 3.2rem;  }
	#gnav .inbox ul.contactlist li.tel p { font-size: 1.4rem; line-height:1.6; }
	#gnav .inbox ul.contactlist li.tel a img { width:20px; height:28px; }
	#gnav .inbox ul.contactlist li.contact a { font-size: 2.4rem; padding:0px 30px 5px; }
	#gnav .inbox ul.contactlist li.contact a img { width:20px; height:16px; margin-top:5px; }
}
@media screen and (max-width: 767px){
	#gnav .navbox { display: block; width: 100%; padding: 110px 0; }
	#gnav ul.topiclist { display:block; margin:0 8%; width:84%; }
	#gnav ul.topiclist li { display:block; text-align:left; margin-bottom:10px; }
    #gnav ul.topiclist li a { display: inline-block; text-align:left; }
	#gnav ul.topiclist li a img {display:none; }
	#gnav ul.topiclist li a span { font-size:1.4rem; }
	#gnav ul.topiclist li a>span>span { font-size:3.0rem;  }
	#gnav ul.topiclist li:first-child a:after,
    #gnav ul.topiclist li a:after { content:url(../img/common/next_black.svg); width: 36px; display:inline-block; margin-left:10px; vertical-align:15px; }
	#gnav ul.mainlist { display:block; margin: 30px 8% 60px; }
	#gnav ul.mainlist li { margin-left:0; display:block; margin-bottom: 8px; }
    #gnav ul.mainlist li:nth-child(2),
    #gnav ul.mainlist li:nth-child(3) { display:none; }

    #gnav .inbox { background:#f7f7f7; padding: 30px 8% 60px; }
    #gnav .inbox .title { display:none; }
    #gnav .inbox ul.contactlist { display:block; }
    #gnav .inbox ul.contactlist li:first-child { display:none; }
    #gnav .inbox ul.contactlist li { display:block; margin-left:0; }
    #gnav .inbox ul.contactlist li.contact a { width: 180px; margin: 20px auto; }
}
@media screen and (max-width: 639px){
}
@media screen and (max-width: 500px){
	#gnav .navbox { padding: 90px 0; }
	#gnav ul.topiclist li a span { font-size:1.2rem; font-weight:normal; line-height:1.5; }
	#gnav ul.topiclist li a>span>span { font-size:3.0rem; font-weight:bold; }
    #gnav ul.topiclist li:first-child a:after,
    #gnav ul.topiclist li a:after { vertical-align:8px; }
}









/*//////////////////


Menubtn


//////////////////*/

#menubtn { position: fixed; top: 0; right: 0; display: block; background: transparent; width: 130px; height: 130px; cursor: pointer; z-index: 100000000001; background: #0d0d0d; }
#menubtn a { text-decoration: none; position: relative; display: block; height: 100%; width: 100%; color: #fff; }
#menubtn a:hover { }
#menubtn a .line {
	width: 60px; height: 2px; background: #fff; position: absolute; left: 50%; margin-left: -30px;
	-webkit-transition: all 0.3s; transition: all 0.3s;
}
#menubtn a #line1 { top: 55px; }
#menubtn a #line2 { top: 50%; }
#menubtn a #line3 { top: 75px; }
#menubtn a:hover #line1 { top: 50%; }
#menubtn a:hover #line3 { top: 50%; }
#menubtn.active a .line { width: 60px; }
#menubtn.active a #line1 {
	-webkit-transform:translateY(10px) translateX(0) rotate(-25deg);
	transform:translateY(10px) translateX(0) rotate(-25deg);
}
#menubtn.active a #line2 { display: none }
#menubtn.active a #line3 { 
	-webkit-transform:translateY(-10px) translateX(0) rotate(25deg);
	transform:translateY(-10px) translateX(0) rotate(25deg);
}
#menubtn.active a:hover #line1 { top: 55px; }
#menubtn.active a:hover #line3 { top: 75px; }
@media screen and (max-width: 1040px){
	#menubtn { width: 90px; height: 90px; }
	#menubtn a .line { width: 40px; margin-left:-20px; }
	#menubtn a #line1 { top: 35px; }
	#menubtn a #line2 { top: 50%; }
	#menubtn a #line3 { top: 55px; }
	#menubtn.active a .line { width: 42px; }
	#menubtn.active a #line1 {
		-webkit-transform:translateY(8px) translateX(0) rotate(-25deg);
		transform:translateY(8px) translateX(0) rotate(-25deg);
	}
	#menubtn.active a #line2 { display: none }
	#menubtn.active a #line3 { 
		-webkit-transform:translateY(-11px) translateX(0) rotate(25deg);
		transform:translateY(-11px) translateX(0) rotate(25deg);
	}
	#menubtn.active a:hover #line1 { top: 35px; }
	#menubtn.active a:hover #line3 { top: 55px; }
}
@media screen and (max-width: 500px){
	#menubtn { width: 80px; height: 80px; }
	#menubtn a #line1 { top: 34px; }
	#menubtn a #line2 { top: 50%; }
	#menubtn a #line3 { top: 46px; }
	#menubtn.active a #line1 {
		-webkit-transform:translateY(6px) translateX(0) rotate(-25deg);
		transform:translateY(6px) translateX(0) rotate(-25deg);
	}
	#menubtn.active a #line2 { display: none }
	#menubtn.active a #line3 { 
		-webkit-transform:translateY(-6px) translateX(0) rotate(25deg);
		transform:translateY(-6px) translateX(0) rotate(25deg);
	}
	#menubtn.active a:hover #line1 { top: 34px; }
	#menubtn.active a:hover #line3 { top: 46px; }
}








/*//////////////////


Mainv.index


//////////////////*/

#mainv.index { position: relative; height: 850px; display: flex; justify-content: center; align-items: center; }
#mainv.index .inbox { width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: flex; justify-content: space-between; align-items: center; }
#mainv.index .inbox:after { content:url(../img/common/cross.svg); width: 80px; position:absolute; top:50%; margin-top:40px; left: 50%; margin-left: -40px; z-index: 1; }
#mainv.index .inbox:before { content:url(../img/common/scroll.svg); width: 36px; position:absolute; bottom:20px; left: 50%; margin-left: -18px; z-index: 1;animation: scrollmove2 3s ease-out 1s infinite; }
#mainv.index .inbox .scrollbar { height: 5px; width: 2px; background: #fff; font-size: 0; position:absolute; bottom:40px; left: 50%; margin-left: -1px; z-index: 1; display: block; animation: scrollmove 3s ease-out 1s infinite;}
#mainv.index a { position: relative; width: 50%; height: 100%; overflow: hidden; display: block;}
#mainv.index a:before { content:url(../img/common/prev.svg); width: 48px; display:inline-block; position:absolute; top:50%; margin-top:50px; left:50px; transition: 0.6s cubic-bezier(0.22, 0.61, 0.36, 1); }
#mainv.index a:nth-child(2):before { transform:rotate(180deg); left:auto; right:50px; }
#mainv.index a:hover { width: 50%; }
#mainv.index a:hover:before { left:20px; }
#mainv.index a:nth-child(2):hover:before { left: auto; right:20px; }
#mainv.index a { text-decoration:none; }
#mainv.index a .mvbox { display: flex; justify-content: center; align-items: center; flex-direction: column; position: relative; width: 100%; height: 100%; color:#fff; }
#mainv.index a .sub { font-size:2.0rem; margin-top:170px; }
#mainv.index a .title { font-size:5.0rem; font-weight:bold; line-height:1; margin:20px 0 15px; }
#mainv.index a:nth-child(1) .title{ line-height: 1.3; margin-bottom: 10px; margin-top: 10px; text-align: center; letter-spacing: -0.1rem;}
#mainv.index a:nth-child(2) .title { width:336px; margin-top:12px; }
#mainv.index a:nth-child(2) .title img { width:100%; }
#mainv.index a:nth-child(2):hover .title img  { transform: scale(1); }
#mainv.index a .label { font-size:1.3rem; background:#0d0d0d; color:#fff; letter-spacing:0.2em; line-height:1; padding: 5px 20px; }
#mainv.index a:nth-child(2) .label { background:#fff; color:#0d0d0d; padding: 5px 20px; }
#mainv.index a .desc { font-size:2.0rem; font-weight:bold; margin-top:20px; text-align: center; letter-spacing: -0.1rem; line-height: 3.4rem;}
#mainv.index a:nth-child(2) .desc { font-size:3.4rem; }
#mainv.index a .bg { position: absolute; height: 100%; width: 100%; object-fit: cover; font-family: 'object-fit: cover;'; /*IE対策*/ z-index:-1; top: 0; left:0; }
#mainv.index a:first-child .bg { object-position:20% 50%; }
#mainv.index .maincopy { display:inline-block; font-size: 4.2rem; line-height: 1.6; letter-spacing: 0.26em; padding:5px 30px 8px; margin-bottom:300px; font-feature-settings : "palt"; background: #0d0d0d; color: #fff; }
@media screen and (max-width: 1280px){
	#mainv.index a:before { left:30px; }
	#mainv.index a:nth-child(2):before { right:30px; }
    #mainv.index a .title { font-size:4.0rem; }
    #mainv.index a:nth-child(2) .title { width:270px; }
    #mainv.index a .desc { font-size:1.8rem; }
    #mainv.index a:nth-child(2) .desc { font-size:2.8rem; }
    #mainv.index .maincopy { font-size: 3.5rem; margin-bottom: 250px; }
}
@media screen and (max-width: 1040px){
	#mainv.index a:before { width: 40px; }
	#mainv.index a:nth-child(2):before { right:30px; }
    #mainv.index a .sub { font-size:1.8rem;  }
    #mainv.index a .title { font-size:3.4rem; }
    #mainv.index a:nth-child(2) .title { width:200px; }
    #mainv.index a .label { font-size:1.2rem; }
    #mainv.index a .desc { font-size:1.6rem; }
    #mainv.index a:nth-child(2) .desc { font-size:2.4rem; }
    #mainv.index .maincopy { font-size: 3.0rem; margin-bottom: 200px; }
}
@media screen and (max-width: 767px){
	#mainv.index .inbox { flex-direction:column; }
	#mainv.index .inbox:after { display:none; }
	#mainv.index a { width:100%!important; transform: scale(1.05)!important; }
    #mainv.index a .sub { margin-top:0; }
    #mainv.index a:before { width: 30px; top:50%; margin-top:-15px; left:20px; }
    #mainv.index a:nth-child(2):before { right:20px; }
	#mainv.index .maincopy { margin-bottom:0;font-size: 2.8rem; }
}
@media screen and (max-width: 500px){
	#mainv.index { height: calc(100vh - 80px); }
    #mainv.index a .sub { font-size:1.4rem;  }
    #mainv.index a .title { font-size:3.2rem; margin:10px 0 10px; }
    #mainv.index a:nth-child(2) .title { width:200px; margin-top:5px; }
    #mainv.index a .label { font-size:1.0rem; }
    #mainv.index a .desc { margin-top:2rem; line-height: 2.8rem; }
    #mainv.index .maincopy { font-size: 2.0rem; padding:5px 20px 8px; letter-spacing:0.13em }
    #mainv.index .inbox:before { width: 30px; margin-bottom:-10px; left: 15px; margin-left: 0; }
    #mainv.index .inbox .scrollbar { height: 5px; width: 2px; left: 29px; margin-left:0; margin-bottom:-14px; animation: scrollmove 3s ease-out 1s infinite;}
}
@keyframes scrollmove {
  0% { bottom: 50px; }
  20% { bottom: 38px; opacity: 1; }
  30% { bottom: 38px; opacity: 0; }
  99% { bottom: 50px; opacity: 0; }
  100% { bottom: 50px; opacity: 1; }
}

@keyframes scrollmove2 {
  0% { bottom: 23px; }
  15% { bottom: 20px; }
  99% { bottom: 20px; }
  100% { bottom: 23px;}
}














/*//////////////////


Mainv.under


//////////////////*/

#mainv.under { height: 300px; background: #009ed0; position: relative; display: flex; justify-content: flex-start; align-items: center; }
@media screen and (max-width: 1040px){
}
@media screen and (max-width: 767px){
	#mainv.under { height: 200px; }
}

#mainv.lp { position: relative; height: 800px; display: flex; justify-content: center; align-items: center; }
#mainv.lp .inbox { width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: flex; justify-content: space-between; align-items: center; }
#mainv.lp .inbox:before { content:url(../img/common/scroll.svg); width: 36px; position:absolute; bottom:20px; left: 50%; margin-left: -18px; z-index: 1;animation: scrollmove2 3s ease-out 1s infinite; }
#mainv.lp .inbox .scrollbar { height: 5px; width: 2px; background: #fff; font-size: 0; position:absolute; bottom:40px; left: 50%; margin-left: -1px; z-index: 1; display: block; animation: scrollmove 3s ease-out 1s infinite;}
#mainv.lp .wrap { position: relative; width: 50%; height: 100%; }
#mainv.lp .wrap .mvbox { display: flex; justify-content: center; align-items: center; flex-direction: column; position: relative; width: 100%; height: 100%; color:#fff; overflow: hidden; }
#mainv.lp .wrap .mvbox .pagetitle .title { margin-bottom: 30px; }
#mainv.lp .wrap.blue { background: #009ed0; }
#mainv.lp .wrap.blue .mvbox .copy { color: #fff; }
#mainv.lp .wrap .bg { position: absolute; height: 100%; width: 100%; object-fit: cover; font-family: 'object-fit: cover;'; /*IE対策*/ z-index:-1; top: 0; left: 0; }
#mainv.lp .wrap:first-child .bg { object-position:20% 50%;}
#radicalfloor.index #mainv.lp .wrap .mvbox .en img { width: 430px; font-size: 0; }
#radicalfloor.index #mainv.lp .wrap.blue { background: #262626; }
@media screen and (max-width: 1280px){
	#mainv.lp .wrap .mvbox .pagetitle .en { font-size: 5.8rem; }
	#radicalfloor.index #mainv.lp .wrap .mvbox .en img { width: 360px; }
}
@media screen and (max-width: 1040px){
	#mainv.lp .inbox { flex-direction:column; }
	#mainv.lp .wrap { width:100%; }
	#mainv.lp .wrap .mvbox .pagetitle .en { font-size: 7.2rem; }
	#radicalfloor.index #mainv.lp .wrap .mvbox .en img { width: 430px; }
	#mainv.lp .wrap .mvbox .pagetitle .title { margin-bottom: 20px; }
}
@media screen and (max-width: 767px){
	#mainv.lp .wrap .mvbox .pagetitle .en { font-size: 3.6rem; }
	#radicalfloor.index #mainv.lp .wrap .mvbox .en img { width: 240px; }
	#mainv.lp .wrap.blue { height: 330px; padding-bottom: 30px; }
	#mainv.lp .wrap.blue .mvbox { }
}
@media screen and (max-width: 500px){
    #mainv.lp .inbox:before { width: 30px; margin-bottom:-10px; left: 15px; margin-left: 0; }
    #mainv.lp .inbox .scrollbar { height: 5px; width: 2px; left: 29px; margin-left:0; margin-bottom:-14px; animation: scrollmove 3s ease-out 1s infinite;}
}










/*//////////////////


Pankuzu


//////////////////*/

#pankuzu { line-height: 1.4; padding:15px 0; background: #f7f7f7; }
#pankuzu ol { margin: 0 60px; font-size: 0; }
#pankuzu ol li { display:inline; font-size: 1.6rem; }
#pankuzu ol li:before { content:"/"; display: inline-block; margin: 0 5px }
#pankuzu ol li:first-child:before { display: none; }
#pankuzu ol li a:hover { opacity: 0.7; transition: 0.3s; }
@media screen and (max-width: 767px) { 
	#pankuzu{ display: none; }
	#pankuzu ol { margin: 0 6%; }
}






/*//////////////////


Content


//////////////////*/

#main { margin-top: 100px; margin-bottom: 150px; }
@media screen and (max-width: 767px) { 
	#main { margin-top: 40px; margin-bottom: 60px; }
}










/*//////////////////


Cntside


//////////////////*/

#side {  }













/*//////////////////


Footer


//////////////////*/

#footer {  }

/* #fcontactbox */
#fcontactbox {}
#fcontactbox .telbox { background: url(../img/common/footer_bg.jpg) center center; background-size: cover; text-align: center; color:#fff; }
#fcontactbox .telbox a { font-size: 4.3rem; font-weight: bold; font-family: 'Roboto Condensed', sans-serif; line-height:1;color:#fff; }
#fcontactbox .telbox .txt { font-size:1.8rem; font-weight:bold; margin-bottom:20px;}
#fcontactbox .telbox a p.time { font-size: 1.4rem; ; }
#fcontactbox .telbox a img { width:25px; height:34px; margin-right:3px; margin-top:-4px; }
#fcontactbox .onlinebox { background: #009ed0;  }
#fcontactbox .onlinebox .incnt { display: flex; justify-content: center; align-items: center; }
#fcontactbox .onlinebox .txt { color: #fff; font-weight: bold; font-size: 2.4rem; margin-right:20px; }
#fcontactbox .onlinebox .label { font-weight: bold; font-size: 1.8rem; background:#fff; border-radius:20px; padding:0 20px; margin-right:20px;}
#fcontactbox .onlinebox a { display: block; justify-content:center; align-items:center; text-decoration:none; font-size: 2.8rem; padding:30px 40px; background:#f7f7f7; font-weight: bold; font-family: 'Oswald', sans-serif; letter-spacing:0; }
#fcontactbox .onlinebox a:before { content:url(../img/common/icon_mail_black.svg); display:inline-block; width:24px; height:20px; margin-right:8px; vertical-align:-2px;}
#fcontactbox .onlinebox a:hover:before { content:url(../img/common/icon_mail_white.svg); }
#fcontactbox .onlinebox a:hover { background:#0d0d0d; color:#fff;}
@media screen and (max-width: 1040px){
    #fcontactbox .onlinebox .incnt { flex-wrap:wrap; text-align:center; padding:50px 0; }
    #fcontactbox .onlinebox .txt { width:100%; font-size: 2.4rem; margin-right:0; margin-bottom:10px; }
    #fcontactbox .onlinebox .label { background:none; color:#0d0d0d; padding:5px 20px; margin-right:20px; position:relative; }
    #fcontactbox .onlinebox .label:before,
    #fcontactbox .onlinebox .label:after { content:""; height:2px; background:#0d0d0d; width: 100%; position:absolute; top: 0; left:0; }
    #fcontactbox .onlinebox .label:after { top: auto; bottom:0; }
    #fcontactbox .onlinebox a { padding:0px 40px 5px; border:3px solid #0d0d0d; border-radius:40px; }
}
@media screen and (max-width: 767px){
    #fcontactbox .telbox a { font-size: 3.6rem; }
    #fcontactbox .telbox a img { width:22px; height:30px; }
    #fcontactbox .onlinebox .txt { font-size: 1.6rem; margin-right:0px; margin-bottom:0; }
    #fcontactbox .onlinebox .label { margin-top:20px; margin-right:20px; margin-left:20px;}
    #fcontactbox .onlinebox a { margin-top:20px; }
}
@media screen and (max-width: 500px){
}

/* #pagetop */
#pagetop { width: 100%; z-index: 10000; }
#pagetop a { text-decoration: none; display: block; padding: 10px 0; text-align: center; background: #f7f7f7; }
#pagetop a:hover { opacity: 1; background: #e6e6e6;  }
#pagetop svg { stroke:#0d0d0d; width: 16px; height: 12px; fill-opacity: 0; }
@media screen and (max-width: 767px) { 
}

/* footerinfo */
#footer .incnt { display: flex; justify-content: space-between; align-items: center; padding:100px 0; }
#footer .infobox .logo { width: 170px; margin-bottom: 30px; }
#footer .infobox .logo img { width: 100%; }
#footer #fnav .mainlist { display:flex; }
#footer #fnav .mainlist>li { margin-left: 30px; }
#footer #fnav li a { display: inline; font-size: 1.6rem; text-decoration: none; font-weight:bold;}
#footer #fnav p { font-weight:bold; }
#footer #fnav ul li.hassub li a { font-size: 1.5rem; font-weight:normal; }
#footer #fnav ul.sub li a:before { content:"ー"; margin-right:5px; }
@media screen and (max-width: 1280px) {
	#footer #fnav .mainlist>li { margin-left: 20px; }
}
@media screen and (max-width: 1040px) {
	#footer #fnav { display:none; }
	#footer .infobox .logo { margin-bottom: 20px; }
}
@media screen and (max-width: 767px) {
    #footer .incnt { padding:60px 0; }
}

#crbox { font-size: 1.5rem; text-align: center; padding: 15px 0; background: #f7f7f7; }
@media screen and (max-width: 767px) {
	#crbox { font-size: 1.3rem; padding: 10px 0; }
}



