/*************** 내용 공통 ***************/
.t_center{ text-align:center !important;}
.sub_wrap{ width: 1400px; margin: 0 auto;}

/*준비중*/
.ready{ display: flex; justify-content: center; align-items: center; flex-direction: column; padding-top: 50px;}
.ready .i{ opacity: .2;}
.ready p{ font-size: 25px; color: #333; text-align: center; margin-top: 20px; font-weight: 700;}
.ready strong{ color:#036DB7;}
.ready span{ color: #999; font-size: 16px; display: block; margin-top: 5px; font-weight: 300;}

/*테이블 - 가로스크롤*/
.row-horizon { position:relative; width:100%; overflow-x: hidden; overflow-y: hidden;}
.tbl_blur{ display: none;}
.tbl_scroll{ display: none;}
/*테이블*/
.tbl table{ width:100%; border-top:1px solid #ccc; border-left: 1px solid #ddd; text-align:center; font-size: 20px; color: #333;}
.tbl caption{ font-size: 0px; height: 0px;}
.tbl thead tr th{ padding:20px 10px; border-bottom:1px solid #444; border-right: 1px solid #ccc; background-color: #f9f9f9;}
.tbl tbody tr th{ padding:20px 10px; border-bottom:1px solid #ccc; border-right: 1px solid #ccc; width: 15%; font-weight: normal; font-weight: 600;}
.tbl tbody tr td{ padding:20px 10px; border-bottom:1px solid #ccc; border-right: 1px solid #ccc; color: #666;}

@media screen and (max-width: 1279px) {
  .sub_wrap{ width: 95%; margin: 0 auto;}
}
@media screen and (max-width: 1023px) {
  .ready p{ font-size: 20px;}
  .ready span{ font-size: 14px;}
  .img2 img{ width:100%;}
  .table_wrap{ position: relative;}
  .tbl_blur{ display: block; position:absolute; top:0px; right:0; width:40px; height:100%; background:url(../img/common/tbl_blur.png) repeat-y right top; z-index:10;}
  .row-horizon {overflow-x: scroll;overflow-y: hidden;white-space: nowrap;float: none; width: 100%;}
  .tbl_scroll{ display: block; font-size:12px; line-height: 12px; color:#888; margin-bottom:10px; padding-left: 5px;}
  .tbl table{ font-size: 18px;}
  .tbl thead tr th{ padding:15px 10px;}
  .tbl tbody tr th{ padding:15px 10px; width: 20%;}
  .tbl tbody tr td{ padding:15px 10px;}

}
@media screen and (max-width: 767px) {
  .tbl table{ font-size: 16px;}
  .tbl thead tr th{ padding:15px 5px;}
  .tbl tbody tr th{ padding:15px 5px; width: 10%;}
  .tbl tbody tr td{ padding:15px 5px;}
}

/*************** 서브 상단비주얼 ***************/
.svisual{ width:100%; height:250px; background-repeat: no-repeat; background-size: cover;  background-position: center top; position: relative;}
.svisual::after{ display: block; content: ""; width: 100%; height: 250px; background-color: rgba(0,0,0,0.3); position: absolute; top: 0px; left: 0px; z-index: 1;}
.sv01{ background-image: url(../img/sub/svisual01.jpg);  background-position: center top;}
.sv02{ background-image: url(../img/sub/svisual02.jpg);}
.sv03{ background-image: url(../img/sub/svisual03.jpg);}
.sv04{ background-image: url(../img/sub/svisual04.jpg);}
.sv05{ background-image: url(../img/sub/svisual05.jpg);}
.sv06{ background-image: url(../img/sub/svisual06.jpg);}
.svisual .sv_in{ width: 1400px; margin: 0 auto; position: relative; z-index: 2;}
.svisual .sv_tit{ position: absolute; top: 80px; left: 50%; transform: translateX(-50%); width: 100%; text-align: center;}
.svisual .sv_tit p{ font-size: 13px; color:rgba(255,255,255,.8); letter-spacing: 3px; margin-bottom: 20px; display: none;}
.svisual .sv_tit h1{ font-size: 50px; font-weight: 400; color:rgba(255,255,255,1);}

/*************** 로케이션 ***************/
.location{ position: absolute; top: 140px; left: 50%; transform: translateX(-50%);}
.location ul{ display:flex; align-items: center; justify-content: center;}
.location li{ font-size: 15px; font-weight: 300; color: #fff; margin-right: 13px;}
.location li .smh{ width: 15px;}
.location li:nth-of-type(1){ margin-bottom: 5px;}
.location li:last-child{ font-weight: 500;}
.location li a{ color: #fff;}

@media screen and (max-width: 1279px) {
  .svisual .sv_in{ width: 95%;}
}
@media screen and (max-width: 1023px) {
  .svisual{ height:180px;}
  .svisual::after{ height: 180px;}
  .svisual .sv_tit{ top: 60px;}
  .svisual .sv_tit h1{ font-size: 40px;}
  .location{ top: 105px;}
  .location li{ margin-right: 10px;}
  .location li .smh{ width: 12px;}
}
@media screen and (max-width:767px) {
  .svisual{ height:120px;}
  .svisual::after{ height: 120px;}
  .svisual .sv_tit{ top: 35px;}
  .svisual .sv_tit h1{ font-size: 30px;}
  .location{ top: 70px; width: 100%;}
  .location li{ font-size: 12px; margin-right: 10px;}
}
@media screen and (max-width:345px) {
  .svisual .sv_tit h1{ font-size: 25px;}
}

/*************** 서브메뉴 ***************/
.smenu_box{ position: absolute; top: -30px; left: 50%; transform: translateX(-50%); /*width: 1400px; margin-left: -700px;*/}
.smenu_box .smenu ul{ display:flex; justify-content: center; align-items: center; box-shadow: 0px 0px 10px rgba(0,0,0,0.15);}
.smenu_box .smenu ul li { text-align: center; background-color: #fff;}
.smenu_box .smenu ul li a{ display:block; font-size:17px; color:rgba(0,0,0,.5); line-height:50px; padding: 0 30px; border-right: 1px solid #eee; position:relative;}
.smenu_box .smenu ul li:last-child a{ border-right: 0;}
.smenu_box .smenu ul li a:hover{ color:#333;}
.smenu_box .smenu ul li a.menu_on{ font-weight: 700; color:#fff; position:relative; background-color: #6FA80A;}
.mo_smenu_box{ display: none;}  

@media screen and (max-width: 1279px) {
  .smenu_box .smenu ul li { width: 130px;}
  .smenu_box .smenu ul li a{ font-size:17px; padding: 0;}
}
@media screen and (max-width: 1023px) {
  .smenu_box{ display: none;}
/*모바일-서브 드롭메뉴*/
/* 서브상단 3차메뉴 */
.mo_smenu_box { position: relative; display: block; margin: 0 auto; width: 100%; line-height:45px; color: #666; vertical-align: middle; text-align: left;
  background:#fff; border-bottom: 1px solid #ddd;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}
.mo_smenu_box .mo_smenu_tit { position: relative; z-index: 1; border-radius: 2px; font-size: 15px; cursor: pointer;}
.mo_smenu_box .mo_smenu_tit:hover {}
.mo_smenu_box .mo_smenu_tit:after { display: block; content: ""; position: absolute; right: 20px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; width: 9px; height: 6px; background: url(../img/common/ico_down.png) no-repeat center center;}
.mo_smenu_box.on .mo_smenu_tit:after { background-image: url(../img/common/ico_up.png);}
.mo_smenu_box.on ul { display: block; box-shadow: 0px 2px 2px rgb(0,0,0,0.1); box-shadow: 0px 2px 2px rgba(0,0,0,0.1);}
.mo_smenu_box.ms_tit .mo_smenu_tit { color: #222; font-weight: 500; padding: 0 15px; display: block;}
.mo_smenu_box ul { display: none; position: absolute; width: 100%; background: #f2f2f2; top: 45px; left: 0px; list-style: none; margin: 0; padding: 0; z-index: 1;
  height:auto !important; border-left:1px solid #dadada; border-right:1px solid #dadada; border-bottom:1px solid #dadada;}
.mo_smenu_box ul li { display: block !important; text-align: left; color: #999; cursor: pointer; height:auto !important; line-height:30px !important;  font-size: 14px !important;
  margin:0 !important;}
.mo_smenu_box ul li a {  display:block; padding: 5px 20px ; border-bottom:1px solid #ececec;}
.mo_smenu_box ul li:last-child a {  border-bottom:0px;}
.mo_smenu_box ul li:hover a { background: #4b545e; color: #fff;}
}

/*************** 내용작업 ***************/

/*인사말*/
.greet{ position: relative; color: #222;}
.gt_tit{ font-size: 30px; font-weight: 700; color: #0D2042; line-height: 1.3; letter-spacing: -1px; margin-bottom: 60px;}
.gt_tit > strong{ font-size: 45px; font-weight: 300; color: #036DB7; display: inline-block; margin-bottom: 5px;}
.greet p{ font-size: 20px; font-weight: 300; color: #666; line-height: 1.8; width: 60%;}
.greet p > strong{ font-size: 28px; font-weight: 600; color: #6FA80A;}
.greet h2{ margin-top: 50px; font-size: 28px;}
.greet h2 > span{ font-size: 22px; font-weight: normal; font-weight: 400;}
.greet .greet_img{ position: absolute; right: 0px; top: 170px;}
.greet .greet_img img{ width: 500px;}
@media screen and (max-width: 1279px) {
  .greet{ padding: 0 5%;}
  .gt_tit{ margin-bottom: 30px;}
  .greet p{ width: 100%;}
  .greet .greet_img{ position: relative; right: auto; top: auto; margin-bottom: 50px;}
}
@media screen and (max-width: 1023px) {
  .gt_tit{ font-size: 25px;}
  .gt_tit > strong{ font-size: 35px;}
  .greet p{ font-size: 18px;}
  .greet p > strong{ font-size: 25px; }
  .greet h2{ margin-top: 30px; font-size: 25px;}
  .greet h2 > span{ font-size: 20px;}
  .greet .greet_img{ margin-bottom: 40px; height: 300px; overflow: hidden;}
  .greet .greet_img img{ width: 100%;}
}
@media screen and (max-width: 767px) {
  .greet{ padding: 0;}
  .gt_tit{ font-size: 22px;}
  .gt_tit > strong{ font-size: 28px;}
  .greet p{ font-size: 17px; line-height: 1.5;}
  .greet p > strong{ font-size: 22px; }
  .greet p > .nbr{ display: none;}
  .greet h2{ font-size: 23px;}
  .greet h2 > span{ font-size: 18px;}
  .greet .greet_img{ margin-bottom: 30px; height: 200px;}
}

/*연혁*/
.his_box{ display: flex; flex-wrap:wrap;}
.his_box .year_box{ /*position: -webkit-sticky; position: sticky; top: 150px; z-index:2; max-height: 200px;*/ width: 360px;}
.his_box .year_box .year{ font-size: 55px; font-weight: 700; color: #222; line-height: 1;}
.his_box .year_box .year > p{ font-size: 30px; font-weight: 300; color: #ccc;}

.his_box .year_info{ position: relative; width: calc(100% - 360px); border-left: 2px solid #ddd;}
.his_box .year_info_bot{ padding-bottom: 100px;}
.his_box .year_info > ul{ margin-top: 100px;}
.his_box .year_info .year_txt{ position: relative; padding-left: 90px; margin-bottom: 50px;}
.his_box .year_info .year_txt:before{ display: block; content: ""; position: absolute; top: 5px; left: -11px; width: 20px; height: 20px; 
  background-color: rgba(111, 168, 10, .3); border-radius:20px;}
.his_box .year_info .year_txt:after{ display: block; content: ""; position: absolute; top: 11px; left: -5px; width: 8px; height: 8px; background-color: #6FA80A; border-radius:20px; z-index: 3;}
.his_box .year_info dl{ display: flex; flex-wrap:wrap;}
.his_box .year_info ul > li > dl > dt{ font-size: 35px; font-weight: 600; color: #6FA80A; width: 150px; margin-top: -6px;}
.his_box .year_info ul > li > dl > dd{ width: calc(100% - 150px);}
.his_box .year_info ul > li > dl > dd  li{ position: relative; padding-left: 80px; font-size: 18px; color: #666; font-weight: 300; line-height: 1.5; 
  margin-bottom: 15px;}
.his_box .year_info ul > li > dl > dd  li strong{ position: absolute; left: 0; top: -2px; width: 80px; display: inline-block; font-weight: 600; font-size: 20px;  color: #222;}
.his_box .year_info ul > li > dl > dd  li .img{ width: 200px;}
.his_box .year_info ul > li > dl > dd  li .img img{ width: 100%;}
@media screen and (max-width: 1279px) {
  .his_box .year_box{ width: 250px;}
  .his_box .year_info{ width: calc(100% - 250px);}
}
@media screen and (max-width: 1023px) {
  .his_box{ width: 90%; margin: 0 auto;}
  .his_box .year_box{ width: 100%; margin-bottom: 20px;}
  .his_box .year_box .year{ font-size: 40px;}
  .his_box .year_box .year > p{ font-size: 25px;}
  .his_box .year_info{ width: 100%;}
  .his_box .year_info_bot{ padding-bottom: 0px; margin-bottom: 40px;}
  .his_box .year_info > ul{ margin-top: 40px;}
  .his_box .year_info .year_txt{ padding-left: 50px; margin-bottom: 30px;}
}
@media screen and (max-width: 600px) {
  .his_box{ width: 95%;}
  .his_box .year_box .year{ font-size: 35px;}
  .his_box .year_box .year > p{ font-size: 20px;}
  .his_box .year_info > ul{ margin-top: 20px;}
  .his_box .year_info .year_txt{ padding-left: 30px;}
  .his_box .year_info ul > li > dl > dt{ font-size:28px; width: 100%; margin: 0 0 20px 0;}
  .his_box .year_info ul > li > dl > dd{ width: 100%;}
  .his_box .year_info ul > li > dl > dd  li{ padding-left: 60px; font-size: 16px; margin-bottom: 10px;}
  .his_box .year_info ul > li > dl > dd  li strong{ width: 60px; font-size: 18px; }
  .his_box .year_info ul > li > dl > dd  li .img{ width: 150px;}
}


/*내용공통*/
.cont_bot{ margin-bottom: 100px;}
.cont_bot2{ margin-bottom: 60px;}
.cont_bot3{ margin-top: 50px;}
.top_txt{ margin-bottom: 100px;}
.top_txt p{ font-size: 23px; line-height: 1.8; color:#222; font-weight: 500; text-align: center;}
.tit{ margin-bottom: 30px;}
.tit h1{ font-size: 30px; font-weight: 500; color: #222;}
.stit{ font-size: 23px; font-weight: 700; color: #333; margin-bottom: 15px;}
.stit::before{ display: block; content: ""; width: 30px; height: 3px; background-color: #6FA80A; margin-bottom: 5px;}
.p p{ font-size: 18px; font-weight: 300; line-height: 1.6; color: #666;}

.ul01 ul{ display: flex; flex-wrap: wrap; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.ul01 li{ font-size: 20px; color: #222; font-weight: 300; width: 33%; border-bottom: 1px solid #ddd; padding: 20px 40px;}
.ul01 li:nth-of-type(4){ background-color: #f4f4f4;}
.ul01 li:nth-of-type(5){ width: 66%; background-color: #f4f4f4;}
.ul01 li:nth-of-type(6), .ul01 li:nth-of-type(7){ border: 0;}
.ul01 li > span{ width: 25px; display: inline-block; margin-right: 10px;}
.ul01 li > span img{ width: 100%;}

.ul02{ margin-top: 20px;}
.ul02 li{ font-size: 18px; color: #222; font-weight: 500; padding: 3px 0;}
.ul03{ margin-top: 20px;}
.ul03 ul{ background-color: #f4f4f4; padding: 30px 40px; border-radius: 10px;}
.ul03 li{ font-size: 18px; color: #222; font-weight: 500; padding: 3px 0;}

.ul04 ul{ display: flex; justify-content: center; flex-wrap: wrap;}
.ul04 li{ width: 280px; height: 280px; border-radius: 50%; background-color: #6FA80A; font-size: 25px; font-weight: 500; color: #fff; text-align: center;
display: flex; align-items: center; justify-content: center; flex-direction:column; margin: 0 -1%;}
.ul04 li > span{ display: block; font-size: 15px; font-weight: 900; margin-bottom: 20px;}
.ul04 li:nth-of-type(2){ background-color: #444;}
.ul04 li:nth-of-type(3){ background-color: #eee; color: #222;}


.sbox_wrap{ display: flex; flex-wrap: wrap;}
.sbox{ width: 30%; border: 1px solid #ccc; border-radius: 10px; padding: 40px 40px; margin: 0 3% 3% 0; box-shadow: 0 5px 15px rgba(0,0,0,0.08);
position: relative;}
.sbox h2{ background-color: #6FA80A; width: 50px; height: 50px; border-radius: 6px; line-height: 50px; font-size: 18px; font-weight: 900; color: #fff;
text-align: center; position: absolute; top: -10px; right: 30px;}
.sbox h1{ font-size: 28px; font-weight: 700; color: #6FA80A;}
.sbox p{ font-size: 18px; font-weight: 300; line-height: 1.5; color: #666; margin: 20px 0 30px 0;}
.sbox ul{ background-color: #f4f4f4; padding: 20px 15px 10px 15px; border-radius: 6px;}
.sbox li{ font-size: 16px; font-weight: 400; color: #222; line-height: 1.3; margin-bottom: 8px; position: relative; padding-left: 8px;}
.sbox li::before{ display: block; content: ""; width: 3px; height: 3px; background-color: #6FA80A; position: absolute; top: 7px; left: 0px;}

.sbox2{ display: flex; flex-wrap: wrap; margin-top: 20px;}
.sbox2 > div{ width: 49%; margin-right: 2%;}
.sbox2 > div:nth-of-type(2){ margin: 0;}
.sbox2 ul{ border: 1px solid #ddd; border-radius: 10px; padding: 30px 30px; min-height: 205px;}
.sbox2 li{ font-size: 18px; color: #222; font-weight: 300; padding: 3px 0;}

.dl01{ margin-bottom: 20px;}
.dl01 dl{ display: flex; flex-wrap: wrap; border: 1px solid #ddd;}
.dl01 dt{ width: 23%; background-color: #f4f4f4; font-size: 23px; font-weight: 700; color: #333; padding: 30px 30px; border-right: 1px solid #ddd;}
.dl01 dd{ width: 67%; padding: 30px 30px; font-size: 20px; font-weight: 300; line-height: 1.5;}
.dl01 dt > span{ width: 30px; display: inline-block; margin-right: 5px;}
.dl01 dt > span img{ width: 100%; filter: invert(57%) sepia(49%) saturate(1044%) hue-rotate(42deg) brightness(89%) contrast(92%);}
.dl02 dt{ width: 25%; padding: 30px 20px;}
.dl02 dd{ width: 65%;}

.lad_top{ display: flex; align-items: center; flex-wrap: wrap; background-color: #f4f4f4; padding: 80px 60px;}
.lad_top .txt{ width: calc(100% - 450px); padding-right: 50px;}
.lad_top .txt h1{ font-size: 45px; color: #333;}
.lad_top .txt h1 > strong{ color: #6FA80A; font-weight: normal; font-weight: 700;}
.lad_top .txt h2{ font-size: 30px; font-weight: normal; color: #999; line-height: 1.3; margin-top: 70px;}
.lad_top .txt h2 > strong{ font-size: 35px;color: #6FA80A;}
.lad_top .img{ width: 450px; border-radius: 30px; overflow: hidden; box-shadow: 0 5px 20px rgba(0,0,0,0.1);}
.lad_top .img img{ width: 100%;}

.lad_top2{ display: flex; align-items: center; flex-wrap: wrap; margin-bottom: 100px; padding: 80px 60px; border: 1px solid #ddd;}
.lad_top2 .img{ width: 450px; border-radius: 30px; overflow: hidden; box-shadow: 0 5px 20px rgba(0,0,0,0.1);}
.lad_top2 .img img{ width: 100%;}
.lad_top2 .txt{ width: calc(100% - 450px); padding-left: 50px;}
.lad_top2 .txt h1{ font-size: 45px; color: #333; margin-bottom: 70px;}
.lad_top2 .txt h1 > strong{ color: #6FA80A; font-weight: normal; font-weight: 700;}
.lad_top2 .txt li{ font-size: 21px; color: #222; font-weight: 300; padding: 5px 0;}
.lad_top2 .txt li > span{ display: inline-block; width: 30px;}
.lad_top2 .txt li > span img{ width: 100%; filter: invert(48%) sepia(90%) saturate(758%) hue-rotate(46deg) brightness(95%) contrast(92%);}
.lad_top2 .txt p{ margin-top: 30px;}
.lad_top2 .txt p > span{ display: inline-block; font-size: 20px; font-weight: 500; color: #999; border-radius: 30px; border: 2px solid #6FA80A;
padding: 0 30px; line-height: 45px; margin-right: 6px;}

.dl03{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.dl03 dl{ width: 32%; text-align: center;}
.dl03 dt{ width: 250px; margin: 0 auto 40px auto;}
.dl03 dt img{ width: 100%;}
.dl03 dd{ font-size: 20px; font-weight: 700; border: 1px solid #ccc; padding: 15px 20px; border-radius: 10px;}

.ul05 ul{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.ul05 li{ width: 30%; border: 1px solid #ddd;}
.ul05 li img{ width: 100%;}

.ul06 ul{ display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 50px;}
.ul06 li{ width: 31%;}
.ul06 li img{ width: 100%;}

.sbox3_wrap{ margin-top: 30px; border-top: 1px dashed #ccc;}
.sbox3{ display: flex; align-items: center; flex-wrap: wrap; border-bottom: 1px dashed #ccc; padding: 30px 10px;}
.sbox3 .img{ margin-right: 50px;}
.sbox3 .img img{ width: 100%;}
.sbox3 dt{ font-size: 28px; font-weight: 600; color: #6FA80A; margin-bottom: 20px;}
.sbox3 dd{ font-size: 20px; font-weight: 300; padding: 5px 0 5px 12px; position: relative;}
.sbox3 dd::before{ display: block; content: ""; width: 4px; height: 4px; border-radius: 50%; background-color: #6FA80A; position: absolute; top: 13px; left: 0px;}

.sbox4_wrap{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.sbox4{ position: relative;}
.sbox4 .img{ width: 280px; height: 280px; border-radius: 50%; overflow: hidden; border: 2px solid #6FA80A; margin: 0 auto 30px auto;}
.sbox4 .img img{ width: 100%;}
.sbox4 h2{ font-size: 16px; color: #fff; line-height: 35px; padding: 0 10px; background-color: #6FA80A; border-radius: 5px; position: absolute; bottom: 70px; left: 50%; transform: translateX(-50%);}
.sbox4 h1{ text-align: center; font-size: 22px; line-height: 1.3; color: #333;}

.sbox5_wrap{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.sbox5{ border: 1px solid #dbdfe6; width: 380px; margin-bottom: 3%;}
.sbox5_a{ width: 290px;}
.sbox5 .img{ margin: 0 auto 20px auto;}
.sbox5 .img img{ width: 100%;}
.sbox5 h2{ font-size: 16px; color: #fff; line-height: 33px; padding: 0 15px; background-color: #6FA80A; border-radius: 50px; margin: 0 30px 10px 30px;
display: inline-block; text-transform: uppercase;}
.sbox5 h1{ font-size: 22px; line-height: 1.3; color: #333; padding: 0 30px 20px 30px;}
.sbox5_a h2{ margin: 0 20px 10px 20px;}
.sbox5_a h1{ font-size: 20px; padding: 0 20px 20px 20px;}

.sbox6 ul{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.sbox6 li{ width: 24%;}
.sbox6 li p{ font-size: 22px; margin-top: 10px; text-align: center;}
.sbox6 img{ width: 100%;}
.sbox7 ul{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.sbox7 li{ width: 33%; height: 270px; overflow: hidden;}
.sbox7 video{ width: 100%; height: 100%;}

.sbox8 ul{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.sbox8 li{ width: 31%; margin-bottom: 3%;}
.sbox8 li p{ font-size: 22px; margin-top: 10px; text-align: center;}
.sbox8 img{ width: 100%;}
.sbox9 li{ width: 50%;}
.sbox9 video{ width: 100%; height: 100%;}



@media (max-width:1279px) {
}
@media (max-width:1023px) {
  .cont_bot{ margin-bottom: 80px;}
  .cont_bot2{ margin-bottom: 50px;}
  .cont_bot3{ margin-top: 40px;}
  .top_txt{ margin-bottom: 80px;}
  .top_txt p{ font-size: 20px;}
  .top_txt p > br{ display: none;}
  .tit{ margin-bottom: 20px;}
  .tit h1{ font-size: 25px;}
  .stit{ font-size: 20px;}
  .p p{ font-size: 17px;}
  
  .ul01 li{ font-size: 18px; padding: 20px 20px;}
  .ul01 li > span{ width: 20px;}

  .ul02 li{ font-size: 17px;}
  .ul03 ul{ padding: 20px 30px;}
  .ul03 li{ font-size: 17px;}

  .ul04 li{ width: 220px; height: 220px; font-size: 22px;}
  .ul04 li > span{ margin-bottom: 10px;}
  
  .sbox{ width: 46%; padding: 40px 30px;}
  .sbox h2{ width: 45px; height: 45px; line-height: 45px;}
  .sbox h1{ font-size: 25px;}
  .sbox p{ font-size: 17px; margin: 10px 0 20px 0;}
  .sbox ul{ padding: 15px 15px 10px 15px;}

  .sbox2 ul{ padding: 20px 20px; min-height: 205px;}
  .sbox2 li{ font-size: 17px;}
  
  .dl01{ margin-bottom: 10px;}
  .dl01 dt{ width: 30%; font-size: 20px; padding: 20px 20px;}
  .dl01 dd{ width: 70%; padding: 20px 20px; font-size: 18px;}
  .dl01 dt > span{ width: 23px; margin-right: 2px;}
  .dl02 dt{ width: 35%; padding: 20px 20px;}
  .dl02 dd{ width: 65%;}

  .lad_top .txt{ width: 100%; padding-right: 0px; margin-bottom: 50px;}
  .lad_top .txt h1{ font-size: 40px;}
  .lad_top .txt h2{ font-size: 25px; margin-top: 40px;}
  .lad_top .txt h2 > strong{ font-size: 30px;}

  .lad_top2{ margin-bottom: 80px;}
  .lad_top2 .txt{ width: 100%; padding-left: 0px; margin-top: 50px;}
  .lad_top2 .txt h1{ font-size: 40px; margin-bottom: 40px;}
  .lad_top2 .txt li{ font-size: 20px;}
  .lad_top2 .txt li > span{ width: 28px;}
  .lad_top2 .txt p{ margin-top: 20px;}
  .lad_top2 .txt p > span{ font-size: 18px; padding: 0 30px; line-height: 40px;}

  .dl03{ display: flex; justify-content: space-between; flex-wrap: wrap;}
  .dl03 dl{ width: 32%; text-align: center;}
  .dl03 dt{ width: 250px; margin: 0 auto 40px auto;}
  .dl03 dt img{ width: 100%;}
  .dl03 dd{ font-size: 20px; font-weight: 700; border: 1px solid #ccc; padding: 15px 20px; border-radius: 10px;}

  .ul06 ul{ margin-top: 30px;}

  .sbox3 .img{ margin-right: 30px;}
  .sbox3 dt{ font-size: 25px; margin-bottom: 10px;}
  .sbox3 dd{ font-size: 18px; font-weight: 300; padding: 3px 0 3px 10px; position: relative;}
  .sbox3 dd::before{ top: 11px;}

  .sbox4_wrap{ width: 90%; margin: 0 auto;}
  .sbox4{ margin-bottom: 5%;}
  .sbox5_wrap{ width: 90%; margin: 0 auto;}
  .sbox5{ width: 48%;}

  .sbox6 ul{ justify-content: center;}
  .sbox6 li{ width: 45%; margin: 0 1% 4% 1%;}
  .sbox6 li p{ font-size: 20px;}
  .sbox7 ul{ justify-content:center;}
  .sbox7 li{ width: 48%; height: 195px; margin: 0 1% 3% 1%;}
  .sbox8 li p{ font-size: 20px;}
}
@media (max-width:767px) {
  .cont_bot{ margin-bottom: 50px;}
  .cont_bot3{ margin-top: 30px;}
  .top_txt{ margin-bottom: 50px;}
  .top_txt p{ font-size: 18px; line-height: 1.5;}
  .tit h1{ font-size: 23px;}

  .ul01 li{ width: 50%; padding: 15px 10px;}
  .ul01 li:nth-of-type(3), .ul01 li:nth-of-type(4){ background-color: #f4f4f4;}
  .ul01 li:nth-of-type(5){ width: 100%; background-color: #fff;}
  .ul01 li:nth-of-type(6){ width: 100%; background-color: #f4f4f4; border-bottom: 1px solid #ddd;}
  .ul01 li:nth-of-type(7){ width: 100%;}
  .ul03 ul{ padding: 30px 20px;}
  .ul04 li{ margin: -1% auto;}

  .sbox_wrap{ width: 95%; margin: 0 auto;}
  .sbox{ width: 100%; padding: 40px 30px; margin: 0 0 6% 0; box-shadow: none;}

  .sbox2{ display: block;}
  .sbox2 > div{ width: 100%; margin: 0 0 4% 0;}
  .sbox2 > div:nth-of-type(2){ margin: 0 0 4% 0;}
  .sbox2 ul{ min-height: auto;}

  .dl01 dl{ display: block;}
  .dl01 dt{ width: 100%; padding: 15px 20px; border-right: 0; border-bottom: 1px solid #ddd;}
  .dl01 dd{ width: 100%;}
  .dl02 dt{ width: 100%; padding: 15px 20px;}
  .dl02 dd{ width: 100%;}

  .lad_top{ padding: 50px 10px;}
  .lad_top .txt{ margin-bottom: 30px;}
  .lad_top .txt h1{ font-size: 30px; line-height: 1.3;}
  .lad_top .txt h2{ font-size: 22px; margin-top: 30px;}
  .lad_top .txt h2 > strong{ font-size: 25px;}
  .lad_top .img{ width: 100%;}

  .lad_top2{ margin-bottom: 60px; padding: 50px 10px;}
  .lad_top2 .img{ width: 100%;}
  .lad_top2 .txt{ margin-top: 30px;}
  .lad_top2 .txt h1{ font-size: 30px; line-height: 1.3; margin-bottom: 30px;}
  .lad_top2 .txt li{ font-size: 18px;}
  .lad_top2 .txt li > span{ width: 25px;}
  .lad_top2 .txt p > span{ font-size: 16px; padding: 0 20px; line-height: 35px; margin:0 3px 3px 0;}

  .dl03 dl{ width: 100%; margin: 0 auto 4% auto;}
  .dl03 dt{ width: 200px; margin: 0 auto 20px auto;}
  .dl03 dd{ font-size: 18px; padding: 10px 10px;}

  .ul05 li{ width: 80%; margin: 0 auto 3% auto;}
  .ul06 li{ width: 80%; margin: 0 auto 3% auto;}

  .sbox3 .img{ width: 150px; margin: 0 auto 20px auto;}
  .sbox3 dl{ width: 100%;}

  .sbox4_wrap{ width: 95%;}
  .sbox4{ width: 100%;}
  .sbox4 .img{ width: 250px; height: 250px;}
  .sbox4 h2{ font-size: 14px; bottom: 65px;}
  .sbox4 h1{ font-size: 20px;}

  .sbox5{ width: 100%;}
  .sbox5 h2{ font-size: 14px; line-height: 30px; margin: 0 20px 10px 20px;}
  .sbox5 h1{ font-size: 20px; padding: 0 20px 20px 20px;}

  .sbox6 li{ width: 90%; margin: 0 auto 3% auto;}
  .sbox6 li p{ font-size: 18px;}
  .sbox7 li{ width: 90%; height: auto; margin: 0 auto 3% auto;}
  
  .sbox8 ul{ justify-content: center;}
  .sbox8 li{ width: 90%; margin: 0 auto 3% auto;}
  .sbox8 li p{ font-size: 18px;}
  .sbox9 li{ width: 90%; margin: 0 auto;}
  
}