@charset "utf-8";


/*===============================================
common
===============================================*/

.sp_only { display:none;}
.pc_only { display:block;}

.full_width { width:100%; height:auto;}
strong,.bold { font-weight:bold!important;}

img { width:100%; height:auto;  }
a img:hover { opacity:0.8;} 

a.line { text-decoration:underline; color:#20637b;}

body {  font-family: "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; color:#333;}
body .en { font-family: 'Archivo', sans-serif;}

/*layout*/
.inr { width:1000px; margin:0 auto;}
.sec { padding:40px 0;}
.box { padding:20px; box-sizing:border-box;}
.sec_l { float:left;}
.sec_r { float:right;}
.txt_r { text-align:right;}
.txt_l { text-align:left;}
.indent { padding-left:1em; text-indent:-1em;}
.center { text-align:center;}
.r { text-align:right;}

.flex { display:flex;}

.line { background: linear-gradient(transparent 50%, yellow 50%); padding:5px 8px; }

section { margin:0; padding:0;}

/*===============================================
color
===============================================*/
.red { color:#cf005a!important;}
.orange { color:#c34f2f!important; }
.green { color:#1a4323!important;}
.blue { color:#236bbd!important;}
.white { color:#fff!important;}

/*===============================================
ttl
===============================================*/

.ttl { margin-bottom:30px; text-align:center;}
.ttl h2 { font-size:2.8rem; color:#08478a; font-weight:bold; letter-spacing:1px;}
.ttl p { color:#08478a;}
.ttl.white h2 { color:#fff!important;}

.s_ttl { text-align:center; margin-bottom:30px;}
.s_ttl h3 { padding:0 20px; background: linear-gradient(transparent 60%, #fda529 60%); display:inline-block; font-size:2.0rem; color:#08478a; font-weight:bold;}

/*===============================================
header
===============================================*/

header { position:fixed; z-index:2000; top:0; width:100%; background:#fff; box-shadow:0 0 3px 1px #888;  }
header h1 {  background:#08478a; width:100%; text-align:center; color:#fff; font-size:1.1rem;}
header .inr { position:relative; padding:6px 0 5px 0;}

header .logo { width:280px; float:left;}

header dl { margin-left:110px; float:left; line-height:1.3; color:#08478a; padding-top:6px;}
header dt { font-size:1.1rem;}
header dd { font-size:3.1rem; letter-spacing:1px;}

header .contact { position:absolute; top:16px; right:0; width:280px; }
header .contact a { background:#08478a; border-radius:5px; display:block; color:#fff;  text-align:center; line-height:1.3;  text-indent:50px; padding:13px 20px; padding-left:20px; font-weight:bold;}
header .contact a span { position:relative;}
header .contact a span:after { content:''; background:url(../images/header_tel_img.png) no-repeat; width:140px; height:90px; background-size:cover; position:absolute; left:-148px; bottom:-35px;}
 
/*btn*/
header nav { background:#ebebeb; padding:0px 0;}
header nav ul { display: flex; justify-content: space-around;}
header nav ul li a { font-weight:bold; color:#08478a!important; position:relative;}

header nav ul li:hover a {color:#c34f2f!important;}
header nav ul li:hover a:before { content:''; background:url(../images/allow_r_on.png) no-repeat; width:6px; height:10px; background-size:cover; position:absolute; left:-14px; top:2px;}

#contents { padding-top:110px;}



/*===============================================
main_visual
===============================================*/

.main_visual { background:url(../images/main_bg.jpg); background-size:cover; height:480px; position:relative;}
.main_visual .inr {  z-index:3; text-align:center; position:relative; padding-top:100px; }
.main_visual p {  text-shadow:0 0 0 #000; color:#fff; text-shadow:0 0 3px #013481; font-weight:bold; }
.main_visual .img { width:400px; margin:0 auto; text-indent:-30px;}
.tp-dottedoverlay {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAG0lEQVQYV2NkYGD4z8DAwMgABXAGNgGwSgwVAFbmAgXQdISfAAAAAElFTkSuQmCC");
  background-blend-mode: overlay;
  background-position: 0px ;
  background-size: auto, cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top:0px;
  left:0px;
  z-index: 1;
}

/*===============================================
sec01
===============================================*/

.sec01 { background:url(../images/sec01_bg.jpg) no-repeat center bottom; background-size:cover; min-height:400px;}
.sec01 .sec_l { width:47%; float:left;}
.sec01 .sec_l h3 { background:rgba(8,71,138,0.8); color:#FFF; padding:3px 13px; font-size:1.6rem; margin-bottom:15px; font-weight:bold;}
.sec01 .sec_l p { color:#FFF; text-shadow:0 0 2px #000; font-weight:bold;}

/*===============================================
sec02
===============================================*/

.sec02 {}
.sec02 ul {  justify-content: space-between;}
.sec02 li { width:24%; }
.sec02 li h4 { text-align:center; margin:5px 0 10px 0; font-weight:bold; color:#08478a; font-size:1.5rem;}
.sec02 li p { text-align:justify;}

/*===============================================
sec03
===============================================*/

.sec03 { background:#efefef; }

.sec03 table.table { table-layout:fixed;}
table.table { border-collapse:collapse; background:#FFF; text-align:center;}
.sec03 table.table th,.sec03 table.table td { border:1px #000000 solid; width:13.28%; vertical-align:middle; padding:10px 1px;}
table.table th,table.table td { border:1px #000000 solid;}
table.table th { background:#dce2e9; }
table.table td { font-weight:bold;}
table.table .head th { background:url(../images/bg_pan.jpg); color:#FFF; font-weight:bold;}
table.table .head th img { width:80%;}

/*===============================================
sec04
===============================================*/

.sec04 .company_sec .sec_l { width:45%; }
.sec04 .company_sec .sec_l img { width:80%; margin:0 auto; display:block;}
.sec04 .company_sec .sec_r { width:50%;}

.sec04 .sec_r table { width:100%; }
.sec04 .sec_r table th { color:#08478a;}
.sec04 .sec_r table th,.sec04 .sec_r table td { padding:4px 3px; border-bottom:1px #ddd solid;vertical-align:middle; }

.sec04 .gmap { clear:both; height: 0; overflow: hidden; padding-bottom: 40%; position: relative; margin-top:20px;}
.sec04 .gmap iframe { position: absolute; left: 0; top: 0; height: 100%; width: 100%;}

.staff_sec li { clear:both; }
.staff_sec li:not(:first-child){ border-top:2px #eee solid; padding:20px 0; }
.staff_sec .txt { width:62%;}
.staff_sec dl {font-weight:bold; margin-bottom:10px;}
.staff_sec .sec_l.txt dl { text-align:right; }
.staff_sec dt,.staff_sec dd { display:inline-block; font-size:1.3rem;}
.staff_sec dd {  font-size:1.7rem; margin-left:0.5em;}
.staff_sec .img { width:35%; padding-bottom:10px;}

.staff_sec dl + p { text-align:justify; padding-bottom:30px;}

/*===============================================
sec05
===============================================*/

.sec05 { background:#08478a;}
.sec05 ul { justify-content: space-between; flex-wrap:wrap; margin-top:8px; margin-top:30px;}
.sec05 ul li { background:#FFF; width:48%; padding:20px 15px; box-sizing:border-box; margin-bottom:20px;}
.sec05 ul li div img { float:left; width:30%;}
.sec05 ul li div h4 { float:right; width:65%; padding:5px 0 5px 10px; margin-top:20px; color:#FFF; font-weight:bold; font-size:1.6rem; background:#08478a;}
.sec05 ul li table { margin-top:20px; width:100%; font-size:1.2rem;}
.sec05 ul li table th { background:url(../images/bg_pan.jpg); width:25%; color:#FFF;}
.sec05 ul li table th,.sec05 ul li table td { padding:3px 3px;}
.sec05 ul li table td { text-align:left; padding:3px 10px;font-weight:normal;}

/*
.youtube_sec { 
  position: relative;
  width: 100%;
  margin:0 auto;
  padding-top: 56.25%;}
  
.youtube_sec  iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
*/

.youtube_sec {width:800px; height:450px; margin:0 auto 10px auto;}
.youtube_sec iframe { width:100%; height:100%; }

/*===============================================
sec06
===============================================*/

.sec06 { }
.sec06 .table_style { width:100%;}
.sec06 .table_style dl { width:100%; }
.sec06 .table_style dt,.sec06 .table_style dd {  padding:15px 0;border-bottom:1px #eee solid;}
.sec06 .table_style dt { width:30%; text-align:center; color:#08478a; font-weight:bold;}
.sec06 .table_style dd { text-align:left; box-sizing:border-box;}
.sec06 .table_style .required { display:block; font-size:10px; margin:0 auto; }
.sec06 .table_style .required span { background:#ce4e00; color:#fff; display:inline-block; line-height:1; padding:1px 5px; border-radius:2px;}
.sec06 .table_style dd input[type="text"] { background:#f1f1f1; padding:10px; width:80%;  box-sizing:border-box;}
.sec06 .table_style dd textarea { width:80%; background:#f1f1f1; border:none; padding:10px; box-sizing:border-box;}

.sec06 .radio li { margin-right:35px;}
.radio-input {  display: none;}
.radio-input + label{  padding-left: 25px; position:relative;  font-weight:bold; font-size:1.5rem;}
.radio-input + label::before{
  content: "";
  display: block;
  position: absolute;
  top: -2px;
  left: 0;
  width: 15px;
  height: 15px;
  border: 2px solid #08478a;
  border-radius: 50%;
}
.radio-input:checked + label{
  color: #08478a;
  text-decoration:underline;
}
.radio-input:checked + label::before{
  background:#fda529;
}


/*===============================================
footer
===============================================*/

footer { }
footer .page_top { width:40px; margin:30px auto;}

footer .foot_top {  background:#f3f3f3; padding:30px 0 10px; text-align:center;}
footer .foot_top p { color:#08478a; font-weight:bold;}
footer .foot_top .img { width:180px; margin:20px auto;}

footer .foot_bottom { background:#08478a; padding:30px 0; color:#FFF;}
footer .foot_bottom .inr { }
footer .foot_bottom .sec_l { width:48%;  text-align:right;}
footer .foot_bottom .sec_l img { width:300px; padding-top:5px;}
footer .foot_bottom .sec_r { width:48%;  vertical-align:top; font-weight:normal; line-height:1.4; font-size:1.2;}
footer .foot_bottom .sec_r dt { font-weight:bold;}
footer .foot_bottom .sec_r ul { display:flex; flex-wrap:wrap; margin-top:8px;}
footer .foot_bottom .sec_r ul li { width:28px; margin-right:4px;}

.copyright { color:#000; font-size:11px; text-align:center; padding:30px 0;}

/*recluit_link_btn*/
#recluit_link_btn {  }
#recluit_link_btn a { border: 3px solid #fff; padding-top: 40px; font-size: 15px; font-weight: bold; color: #fff; line-height: 1.4; box-sizing: border-box;  position:fixed; width: 130px; height: 130px; bottom: 100px; right: 10px;  display: block; background:#08478a;  border-radius: 9999px; text-align: center;}
#recluit_link_btn.gradient a { 
  background: rgb(6,63,166);
  background: linear-gradient(0deg, rgba(6,63,166,1) 0%, rgba(85,171,227,1) 100%);
}

@media screen and (max-width: 768px) {

body { font-size:1.2rem;}

.no_br {text-align:left;}
.no_br br { display:none; }
	
.sp_only { display:block;}
.pc_only { display:none;}

.sec_l,.sec_r { float:none;}

/*layout*/
.inr { width:100%; margin:0 auto; padding:0 2%; box-sizing:border-box; }
.sec { padding:40px 0;}
.message p { font-size:12px;}

/*header nav*/
header nav { display:none;}

.menu-trigger { display:block;}
.menu-trigger span { display: inline-block; transition: all .4s; box-sizing: border-box;}
.menu-trigger { position: relative; width: 36px; height: 29px;}

.menu-trigger span { position: absolute;left: 0;width: 100%;height: 4px; background-color: #08478a; border-radius: 4px;}
.menu-trigger span:nth-of-type(1) { top: 0;}
.menu-trigger span:nth-of-type(2) { top: 12px;}
.menu-trigger span:nth-of-type(3) { bottom: 0;}
.menu-trigger.active span:nth-of-type(1) { -webkit-transform: translateY(11px) rotate(-45deg);transform: translateY(11px) rotate(-45deg);}
.menu-trigger.active span:nth-of-type(2) { opacity: 0;}
.menu-trigger.active span:nth-of-type(3) { -webkit-transform: translateY(-15px) rotate(45deg); transform: translateY(-15px) rotate(45deg);}
	
/*===============================================
ttl
===============================================*/

.ttl h2 { font-size:24px; font-weight:bold;}

.s_ttl { margin-bottom:20px;}
.s_ttl h3 { padding:0 20px; background: linear-gradient(transparent 70%, #fda529 70%);  font-size:1.7rem;}

/*===============================================
header
===============================================*/

header {  }
header h1 { font-size:9px; }

header .sp_btn { position:absolute; right:10px; top:30px; }
header nav { top:73px; position:absolute; background:#fff; width:100%; left:0; margin:0; padding:0; box-sizing:border-box; }
header nav ul { display:block; width:100%; padding:0; text-align:center; box-shadow:0 2px 3px #ccc;}
header nav ul li { width:100%; border-top:1px #CCCCCC solid; padding:10px 0;  }
header nav ul li a { width:100%; display:block;}
header nav ul li a:before { content:''; background:url(../images/allow_r.png) no-repeat; width:6px; height:10px; background-size:cover; position:absolute; left:auto; right:10px; top:3px;}
header nav ul li:hover a:before { content:''; background:url(../images/allow_r_on.png) no-repeat; width:6px; height:10px; background-size:cover; position:absolute; left:inherit; right:5px; top:3px;}

header .logo { width:210px; float:none; margin:0 auto; text-indent:-10px;}
header .inr { padding:3px 0 2px 0;}

#contents { padding-top:50px;}

/*===============================================
main_visual
===============================================*/

.main_visual { background:url(../images/main_bg_sp.jpg) left center; background-size:cover; height:400px; position:relative;}
.main_visual .inr { padding-top:80px; }
.main_visual h2 {  font-size:20px;}
.main_visual .img { width:80%; text-indent:-10px;}
.main_visual {}

/*===============================================
sec01
===============================================*/

.sec01 { background:url(../images/sec01_bg_sp.jpg) no-repeat right bottom #0155dc; background-size:cover; }
.sec01 .sec_l { width:100%; text-align:center;}

.sec01 .sec_l h3 { background:none; font-size:1.5rem;}
.sec01 .sec_l p { font-weight:normal; text-shadow:none;}


/*===============================================
sec02
===============================================*/

.sec02 {}
.sec02 ul {  justify-content: space-between; flex-wrap:wrap;}
.sec02 li { width:48%; margin-bottom:20px; }
.sec02 li h4 {  font-size:1.4rem;}

/*===============================================
sec03
===============================================*/

.sec03 { }

.sec03 .font_11 { font-size:9px; margin-top:3px;}
.sec03 .scroll-table {
  overflow: auto;
  white-space: nowrap;
  overflow-scrolling: touch;  /* スクロールを滑らかにする */
  -webkit-overflow-scrolling: touch;  /* スクロールを滑らかにする */
}


.sec03 .scroll-table table { width:700px; }
.sec03 .scroll-table table th,.sec03 .scroll-table table td {font-size:1.1rem!important; padding:5px 2px;}

.sec03 .scroll-table table th:first-child {
  position: sticky;
  left:0;
  top:0;
}

.sec03 .scroll-table table th:first-child:before{
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid #000;
	z-index:2;
	border-right:2px #000 solid;
  }
  

/*===============================================
sec04
===============================================*/

.sec04 .company_sec .sec_l img { width:100%; margin:0 auto; display:block;}
.sec04 .company_sec .sec_l { width:32%; float:left; }
.sec04 .company_sec .sec_r { width:100%;}
.sec04 .company_sec .message { width:65%; float:right; padding-bottom:20px;}

.sec04 .company_sec .company_info { clear:both; font-size:1.1rem;}
.sec04 .company_sec .company_info th { width:25%;}

.sec04 .sec_r table th,.sec04 .sec_r table td { padding:2px 5px;}
.sec04 .gmap {  padding-bottom: 55%; }

.staff_sec li:not(:first-child){ border-top:2px #eee solid; padding:12px 0;}
.staff_sec .txt { width:100%;}
.staff_sec .txt dl { text-align:center!important; }
.staff_sec .txt img { width:60%; margin:10px auto;}
.staff_sec .txt p { font-size:1.1rem;}

.staff_sec dt,.staff_sec dd { display:block;}

/*===============================================
sec05
===============================================*/

.sec05 { }
.sec05 .center.white { text-align:left;}
.sec05 .center.white br { display:none;}
.sec05 ul { justify-content: space-between; flex-wrap:wrap; margin-top:8px; margin-top:30px;}
.sec05 ul li { background:#FFF; width:100%; }
.sec05 ul li table td { font-size:1.1rem; font-weight:normal;}



/*===============================================
sec06
===============================================*/

.sec06 { }
.sec06 .table_style { width:100%;}
.sec06 .table_style dl { width:100%; display:block; width:100%; border-bottom:1px #CCCCCC dashed; }
.sec06 .table_style dt,.sec06 .table_style dd { border-bottom:none; display:block; width:100%; box-sizing:border-box;}
.sec06 .table_style dt { width:auto; padding-bottom:10px; }
.sec06 .table_style dd { width:auto; padding-top:0;}
.sec06 .table_style dd input[type="text"] { width:100%;}
.sec06 .table_style dd textarea {  width:100%; }

.sec06 .radio ul { justify-content: center;}


.youtube_sec { 
  position: relative;
  width: 100%;
  height:auto;
  padding-top: 56.25%;}
  
.youtube_sec  iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}




/*===============================================
footer
===============================================*/

footer .page_top { width:30px;}
footer .foot_bottom {padding:30px 0; color:#FFF;}
footer .foot_bottom .inr { }
footer .foot_bottom .sec_l { width:40%; margin:0 auto; text-align:center;}
footer .foot_bottom .sec_l img { width:100%;}
footer .foot_bottom .sec_r { width:100%; text-align:center; margin:10px 0; }
footer .foot_bottom .sec_r dt { font-size:14px; margin:4px 0 2px 0; font-weight:bold;}
footer .foot_bottom .sec_r ul { display:flex; flex-wrap:center;justify-content: center; }
footer .foot_bottom .sec_r ul li { width:34px; margin-right:4px; margin-top:10px;}
footer .foot_bottom .sec_r  a { color:#FFF!important;}

.sp_tel a { z-index:10; width:100%; position:fixed; bottom:0; background:#08478a; text-align:center; padding:15px 0 10px;  border-top:2px #fff solid; box-sizing:border-box; line-height:1.5; border-radius:10px 10px 0 0; }
.sp_tel dt { font-size:1.0rem; color:#FFF; }
.sp_tel a:hover { background:#073566; text-decoration:none;}
.sp_tel a dd { color:#f4cf02; font-size:5.0vw; letter-spacing:1px; font-weight:bold;} 

.sp_tel dl { position:relative; padding-left:35px; text-stroke: 1px #08478a;  }
.sp_tel dl:before { content:''; background:url(../images/header_tel_img.png) no-repeat; width:150px; height:100px; background-size:cover; position:absolute; left:-10px; bottom:-10px; z-index:1;}

.sp_tel dt { position:relative; z-index:2; text-shadow:1px 1px 0 #08478a;}
.sp_tel dd { position:relative; z-index:3; text-shadow:1px 1px 0 #08478a;}


/*recluit_link_btn*/
#recluit_link_btn {  }
#recluit_link_btn a { width: 90px; height: 90px; font-size: 13px; padding-top: 30px; line-height: 1.3; border-width: 2px; z-index: 10000;}

}