@charset "utf-8";
/*
	Last Update:2019/06/08
	Auther: iw
*/
/*===================================================================
	layout
===================================================================*/
body { text-align:center; overflow-x:hidden; }
#base { position:relative; }
#body { position:relative; }
	@media (max-width: 767px){
		body:not(#top) #base { padding-top:60px; }
	}
	@media (min-width: 768px){
		body#top #base { padding-top:90px; }
	}

.wrapper { padding-top:70px; padding-bottom:70px; }
.wrapper-t { padding-top:70px; }
.wrapper-b { padding-bottom:70px; }
.center { max-width:1000px; margin:0 auto; text-align:left; }
.center2 { max-width:800px; margin:0 auto; text-align:left; }
.center3 { max-width:1400px; margin:0 auto; text-align:left; }
	@media (max-width:1030px){
		.center { padding-left:15px; padding-right:15px; }
	}
	@media (max-width:830px){
		.center2 { padding-left:15px; padding-right:15px; }
	}
	@media (max-width:1430px){
		.center3 { padding-left:15px; padding-right:15px; }
	}


/*===================================================================
	#head
===================================================================*/
#head { position:absolute; left:0; z-index:999; line-height:100%; display:table; background:#0b9662; }
#head * { transition:all .5s; }
#head > * { display:table-cell; vertical-align:middle; }
#head .site_logo { text-align:center; }
#head .site_logo a { display:block; }

/* menu */
#head .main > ul { display:table; width:100%; }
#head .main > ul > li { display:table-cell; }
#head .main > ul > li > a { text-decoration:none; color:#fff; font-size:13px; display:inline-block; padding:10px 0; }
#head .sub { position:absolute; top:60px; left:-50vw; width:0; overflow:hidden; border-top:1px solid #fff; background:#fff; }
#head .sub .title { background:#0b9662; padding:10px; color:#fff; }
#head .sub .row { width:100%; padding:15px 10px 10px; }
#head .sub a { color:#333; display:block; border:1px solid #ccc; margin:0 10px 15px; text-decoration:none; font-size:13px; }
#head .sub a .photo { display:block; padding:0 15px; }
#head .sub a .text { display:block; padding:8px 0; background:#eee; font-size:12px; }

body.pc #head .main > ul > li > a { position:relative; }
body.pc #head .main > ul > li > a:after { content:""; background:#fff; position:absolute; bottom:2px; width:0; height:3px; transition:all .3s; left:50%; }
body.pc #head .main > ul > li > a:hover:after { width:100%; left:0; }
body.pc #head .sub a:hover { opacity:0.8; }

/* menu button */
#menu_cover { position:fixed; top:0; left:0; z-index:998; width:100vw; height:100vh; overflow:hidden; background:rgba(0,0,0,0.2); }
#btn_open a { display:block; color:#fff; text-align:center; font-size:25px; padding:0 20px; }
#base:not(.fixed) #btn_open { display:none; }
#base.fixed #head { position:fixed; top:0; left:0; box-shadow:0 0 5px #999; }
#base.fixed #head .main { width:0; overflow:hidden; }
#base.open #head .main { width:100%; }
#base.open.fixed #head .sub { left:0; }
	@media (max-width: 767px){
		#head { top:0; }
		#base:not(.fixed) #head, 
		#base.open #head { width:100%; }
		#head .site_logo { width:60px; }
		#head .main > ul > li { border-right:1px solid #fff; }
		#head .main > ul > li:last-child { border:none; }
		#head .main > ul > li > a { font-size:12px; height:57px; overflow:hidden; }
		#head .main > ul > li > a i { display:block; margin-bottom:10px; font-size:16px; }
		#base.open.fixed #head .sub { width:100vw; }
		#base.open.fixed #btn_open { border-right:1px solid #fff; }
		#base.open.fixed #btn_open a { padding:0 15px; }
	}
	@media (min-width: 768px){
		#head { top:20px; }
		#head .site_logo, #head .site_logo img { width:90px; }
		#head .main > ul { min-width:500px; }
		#head .main > ul > li { padding:0 20px; }
		#head .main > ul > li > a i { display:none; }
		#head .sub .row { min-width:600px; }
		#base.fixed #head .site_logo { width:60px; }
		#base.open.fixed #head .sub { width:100%; }
		#head._type2 { top:0; width:100%; }
		#head._type2 .main > ul > li > a { font-size:1.15em; font-weight:bold; }
		#head._type2 .sub { box-shadow:5px 0 5px rgba(0,0,0,0.2); }
		#head._type2 .sub .col-xs-3 { width:calc(100% / 6); }
		#head._type2 .sub .row { max-width:1300px; margin:0 auto; }
		#base.fixed #head._type2 #btn_open { display:none; }
		#base.fixed #head._type2 .main { width:100%; }
		#head._type2 li:hover .sub { left:0 !important; width:100% !important; }
		#base:not(.fixed) #head._type2 li:hover .sub { top:90px; }
	}
	@media (min-width: 768px) and (max-width: 991px){
		#head._type2 .sub a .text { font-size:11px; }
	}


/*===================================================================
	#foot
===================================================================*/
#pagetop { text-align:center; padding:50px 0; }
#pagetop a { color:#999; text-decoration:none; }
#pagetop a span { display:block; }

#foot { position:relative; }
#foot a { text-decoration:none; color:#555; }
body.pc #foot a:hover { text-decoration:underline; }

#foot .center3 { max-width:1100px; }
#foot .bg1 { padding:40px 0; }
#foot .bg1 h5 { font-size:1.25em; }
#foot .bg0 img { vertical-align:middle; }

#foot_sns li { padding:5px 0; }
#foot_sns a i { display:inline-block; border:1px solid #fff; border-radius:50%; font-size:28px; width:50px; height:50px; line-height:50px; text-align:center; vertical-align:middle; margin:0 10px 0 0; }
#foot .copyright { font-size:12px; padding:30px 0 0; }

	@media (max-width: 575px){
		#foot { padding-bottom:70px; }
		#foot .bg0 { padding:20px 0; }
		#foot .bg0 .center3 { text-align:center; }
		#foot .bg0 img { width:20%; }
		#foot .bg0 .banner { display:inline-block; width:50%; }
		#foot .bg0 .banner img { width:100%; }
	}
	@media (min-width: 576px) and (max-width: 767px){
		#foot { display:table; width:100%; margin-bottom:60px; }
		#foot > * { display:table-cell; vertical-align:middle; }
		#foot .bg0 { width:40%; }
		#foot .bg0 img { width:45%; }
	}
	@media (max-width:767px){
		#foot .bg1 p { font-size:12px; }
		#foot .copyright { display:none; }
		#foot_navi { display:none; }
	}
	@media (min-width:768px){
		#foot:after { content:""; position:absolute; top:0; right:0; width:60vw; height:100%; background:url(../image/foot/image1.jpg) no-repeat right top / cover; }
		#foot_navi { font-size:13px; vertical-align:middle; }
		#foot_navi li { padding:10px 0; }
		#foot_navi li a { position:relative; display:block; padding:0 30px 0 10px; }
		#foot_navi li a:after { content:"\f105"; position:absolute; right:0; font-family:"Font Awesome 5 Free"; -webkit-font-smoothing:antialiased; text-rendering:auto; font-variant:normal; font-weight:bold; }
		#foot .bg0 { padding:40px 0 20px; }
		#foot .bg0 img { width:80px; }
		#foot .bg0 .banner { margin-top:20px; }
		#foot .bg0 .banner img { width:160px; }
	}

#foot_contact { position:fixed; z-index:999; bottom:0; right:0; box-shadow:0 0 8px #666; }
#top #foot_contact { bottom:30px; }
#top #base.fixed #foot_contact { bottom:0; }
#foot_contact a { text-decoration:none; }
#foot_contact .disp_tbl { width:100%; }
#foot_contact .disp_td { width:50%; }
#foot_contact a, #foot_contact span { display:block; padding:20px 0; }
#foot_contact .tel, #foot_contact .tel a { color:#fff; }
#foot_contact .bg0 { border-radius:40px 0 0 40px; }

	@media (max-width:767px){
		#foot_contact { width:100%; font-size:1.25em; }
	}
	@media (min-width:768px){
		#foot_contact { width:400px; }
	}


/*===================================================================
	#sub
===================================================================*/
/* title */
#page_title { position:relative; background-repeat:no-repeat; background-position:center top; background-size:auto 23vw; }
#page_title h2 { text-align:center; color:#fff; text-shadow:0 0 5px #555; }
#page_title h2 .sub { display:block; font-size:13px; }
	
	#news #page_title { background-image:url(../image/contents/news/back.jpg); }
	#company #page_title { background-image:url(../image/contents/company/back.jpg); }
	#contact #page_title { background-image:url(../image/contents/contact/back.jpg); }
	#privacy #page_title { background-image:url(../image/contents/privacy/back.jpg); }
	#recruit #page_title { background-image:url(../image/contents/recruit/back.jpg); }
	#service #page_title { background-image:url(../image/contents/service/back.jpg); }
	#case #page_title { background-image:url(../image/contents/case/back.jpg); }
	
	@media (max-width: 575px){
		#page_title { background-size:auto 28vw; }
		#page_title h2 { padding:30px 0; font-size:1.8em; }
	}
	@media (min-width: 576px) and (max-width: 767px){
		#page_title h2 { padding:30px 0 20px; font-size:2em; }
	}
	@media (min-width: 768px){
		#page_title { height:20vw; min-height:300px; max-height:330px; overflow:hidden; background-attachment:fixed; }
		#page_title h2 { padding:180px 0 0; font-size:2.5em; }
		#page_title h2 span { padding:0 0 10px; }
	}

/* pankuzu */
#pankuzu { text-align:left; font-size:13px; }
#pankuzu a { color:#ff9400; }
#pankuzu li { display:inline-block; }
#pankuzu li:before { content:"\f054"; font-family:"Font Awesome 5 Free"; -webkit-font-smoothing:antialiased; text-rendering:auto; font-variant:normal; font-weight:bold; font-size:0.85em; line-height:200%; padding:0 5px; color:#e2e2e2; }
#pankuzu ul > li:first-child:before { content:""; }
	@media (min-width:768px){
		#pankuzu { padding:5px 15px; }
	}
	@media (max-width:767px){
		#pankuzu { padding:5px 10px; }
	}
