@charset "utf-8";


/****************************************************** sub 공통 */
/* sub visual */
#sv{position:relative; overflow:hidden; margin-top: 110px;}
#sv .visual {width: 100%; height: 314px; background-position: 50% 50%; background-image: url('../images/sub/sv.jpg'); background-repeat: no-repeat;  background-size:cover; transform:scale(1.3); animation: sv-bg-change 5s infinite;}
#sv .txt_wrap {color: #222; position: absolute; width: 1000px;  top: 50%; left: 50%;  margin-left: -550px; -webkit-transform:translateY(-50%); transform:translateY(-50%); /* padding: 0 75px; */z-index: 1;}
#sv .txt_wrap .tit {color: #fff; line-height: 0.8;}
#sv .txt_wrap .txt {color: #fff; word-break:keep-all;}

#sv1{position:relative; overflow:hidden;}
#sv1 .visual {width: 100%; height: 314px; background-position: 50% 50%; background-image: url('../images/sub/sv.jpg'); background-repeat: no-repeat;  background-size:cover; transform:scale(1.3); animation: sv-bg-change 5s infinite;}
#sv1 .txt_wrap {color: #222; position: absolute; width: 1000px;  top: 50%; left: 50%;  margin-left: -600px; -webkit-transform:translateY(-50%); transform:translateY(-50%); /* padding: 0 75px; */z-index: 1;}
#sv1 .txt_wrap .tit {color: #fff000; line-height: 0.8;}
#sv1 .txt_wrap .txt {color: #ffffff; word-break:keep-all;}


@-webkit-keyframes sv-bg-change {
	0% {-webkit-transform: scale(1);animation-timing-function: ease-in;}
	50% {-webkit-transform: scale(1.1); animation-timing-function: ease-out;}
	100% {-webkit-transform: scale(1); }
}

@keyframes sv-bg-change {
	0% {transform: scale(1);  animation-timing-function: ease-in;}
	50% {transform: scale(1.1);  animation-timing-function: ease-out;}
	100% {transform: scale(1); }
}


.navigation {padding: 8px 0; background-color: #fff; color: #888; font-weight: 300; font-size: 12px; text-align:right; top:95px;}
.navigation strong {font-weight: 400; color: #444;}

.s_area { padding:0 0;}
.con {padding-bottom: 130px;}
.box { background-color:#f1f1f1; padding:60px  15px; text-align:center;}

.page_tit {padding: 60px 0 50px;text-align: center; font-family: 'Nexen';color: #0173ba; letter-spacing: -1px;}
.s_tit {letter-spacing: -1px;  line-height: 1.33;padding-left: 40px; margin-bottom: 15px; position: relative; word-break:keep-all;}
.s_tit:after {content:''; display: block; width: 35px; height: 40px; background: url('../images/sub/s_tit_icon.png') 0 0 no-repeat; position: absolute; top: -3px; left: 0px;}


.tab {width: -webkit-fill-available;margin: -40px auto 0;text-align: center;font-size: 0;margin-left:0; z-index:1; border-bottom:1px solid #ddd;}
.tab ul {}
.tab li  {display: inline-block; vertical-align: top; margin:0;  width:33%; padding:30px 0; position: relative;}
.tab li a {display: block;  text-align: center; font-size: 20px; font-weight: 500; color: #777;  border-left: none;  transition: .25s;}
.tab li a:hover { color: #222; font-weight: 600; }
.tab li a.active { color: #222; font-weight: 600; }

.tab li a.active::after {content: '';background-color: #222;width: 110px;height: 4px;position: absolute;top: 78%;left: -32px;transform: translate(100%,-50%);}




.con1 { padding:100px 0;}
.title_txt{position: relative;padding-left: 25px;line-height: 1;word-break:keep-all;margin-bottom: 30px;font-size:24px;font-weight:600; color:#00377b;}
.title_txt:after {content:'';display: block;width: 5px;height: 22px;background-color:#00377b;position: absolute;top: 0;left: 5px;}

.tit_wrap {display: flex; align-items:center; padding:20px 30px; border-top:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9; margin-top:-1px;} 
.tit_wrap h4 {width: 80px; color:#000; font-weight:700;} 


.gray_box {background-color:#f9f9f9;padding:25px 30px;border:1px solid #ddd;border-radius:15px;display: flex;align-items: center;}
.gray_box .btn {background-color:#00377b; color:#fff; position: absolute;right: 16%; padding:10px 20px; transition:.25s;}
.gray_box .btn:hover {background-color:#0094e8; }
.gray_box .btn1 {background-color:#666; color:#fff; position: absolute;right: 3%; padding:10px 20px; transition:.25s;}
.gray_box .btn1:hover {background-color:#0094e8; }

.blue{ color:#0094e8;}
.con1 .logo { position: absolute; top: 55%;  right: 0;}
.map_wrap {position: relative; }
.map_wrap .map {width: 100%; height: 435px; /*background: url('/img/common/map_bg.jpg') 50% 50% no-repeat; background-size:cover;*/ overflow:hidden; }

.map_wrap .icon { display:flex; align-items: center; margin-left:5px;}
.pl15 { padding-left:15px;}



table{width:100%;border-spacing:0;border-collapse:collapse;}

.blue_tb {border-right: 1px solid #fff;}
.blue_tb th,
.blue_tb td {padding: 15px 20px; border: 1px solid #ddd;}
.blue_tb th {font-weight:500; vertical-align: middle; background-color: #d5a47d; color: #fff;}
.blue_tb td {vertical-align: middle; color: #666;  background-color:#fff;}
.blue_tb td p{ display:inline-block; vertical-align:middle; padding:0 5px;}
.blue_tb td .icon { padding-left:5px}
.blue_tb td .txt { text-align:left; width:40%}


.changed_box {width: 100%;border-radius: 15px;padding: 25px 80px;background-color:#f9f9f9;}
.changed_box ul { display: flex; flex-wrap: wrap;}
.changed_box ul li { width: 50%; padding: 40px 0;}
        .changed_box ul li:nth-child(1),
        .changed_box ul li:nth-child(2) { }
        .changed_box ul li:nth-child(5),
        .changed_box ul li:nth-child(6) { border: none; padding-bottom: 0;}
.changed_box dl {position: relative;padding-left: 24%;}
.changed_box dl.num1::before { content: ""; display: block; width: 76px; height: 76px; background: url('/assets/images/sub/s21_icon_1.png') no-repeat left; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.changed_box dl.num2::before { content: ""; display: block; width: 76px; height: 76px; background: url('/assets/images/sub/s21_icon_2.png') no-repeat left; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.changed_box dl dt { font-size:20px; font-weight:700; line-height:150%}
.changed_box dl dd { font-size: 18px; line-height:150%}
.changed_box .btn { background-color:#444; color:#fff; padding:15px 0; text-align-last:center; width:65%; margin-top:20px; font-size:18px; font-weight:500; transition:.25s;}
.changed_box .btn:hover { background-color:#0094e8;}
.changed_box .btn1 { background-color:#00377b; color:#fff; padding:15px 0; text-align-last:center; width:65%; margin-top:20px; font-size:18px; font-weight:500; transition:.25s;}
.changed_box .btn1:hover { background-color:#0094e8;}


.sub_tab {display: table; width: 100%;	margin-bottom: 20px;}
.sub_tab li {display: table-cell;  text-align: center; border: 1px solid #00377b; border-left: none; color:#00377b; font-weight: 700;  height:75px; line-height: 75px;}
.sub_tab li:first-child {border-left: 1px solid #00377b;}
.sub_tab li a {display: block;  height:75px; line-height: 75px; transition:.25s;}
.sub_tab li a.active,
.sub_tab li a:hover {font-weight: 700; color: #fff; background: #00377b ;}

.sub_tab.col-2 li {width: 50%;}
.sub_tab.col-3 li {width: 33.33%;}
.sub_tab.col-4 li {width: 25%;}
.sub_tab.col-5 li {width: 20%;}

.ft_form_btn { border: 0; background: #00377b; color: #fff;  cursor: pointer; height:55px; line-height:55px;  font-size: 18px; font-weight:500; transition: 0.5s; width:25%; margin:0 auto; display:inline-block;  vertical-align: baseline;}
.ft_form_btn:hover {background: #0094e8;}
.ft_form_btn1 { border: 0; background: #fff; color: #00377b8; border:1px solid #00377b;  cursor: pointer; height:60px; line-height:60px;  font-size: 18px; font-weight:700;  transition: 0.5s; width:25%; margin:0 auto; display:inline-block;  vertical-align: baseline;}
.ft_form_btn1:hover {background: #0094e8; color:#fff; border:1px solid #0094e8;}
.chkbox{margin:20px 0 50px 0;text-align:center;}
.chkbox label input {font-family: inherit; font-style: inherit; height:25px; width:25px; line-height: inherit; margin-right:7px; margin-bottom:2px;}

.partner_list { }
.partner_list li {width: calc(25% - 20px);display: inline-block;margin: 0 8px 30px;}
.partner_list li .icon {transition:.5s;background-color:#fff;text-align: center;}
.partner_list li .icon img {box-shadow: 2px 3px 5px 5px rgba(0,0,0,0.03);border-radius:10px;}
.partner_list li .txt {transition:.5s; text-align:center; padding:20px 0 0; background-color:#fff; color:#222;}
.partner_list li:hover {color:#428bca;}

.img_list { position:relative;}
.img_list li {display: flex;justify-content:space-between; align-items: center; border-bottom:1px solid #ddd; padding-bottom:50px; margin-bottom:50px;}
.img_list li:nth-child(even) {/*flex-direction: row-reverse;*/}
.img_list li > div {width: 50%; }
.img_list li .img_box .img {width: 100%; /*height: 100%;*/ background-size:auto; background-repeat:no-repeat; background-position: 50% 50%;}
.img_list li .txt_box {/* padding: 0 40px 0; */background-color: transparent;position: relative;}
.img_list li .img_box .img img{   transition:.5s;  /*box-shadow: 0px 1px 20px 10px rgba(0, 0, 0, 0.1);  border-radius: 20px;*/ }
.img_list li .img_box:hover  img {transform:scale(1.05);}
.img_list li .txt_box .img {width: 100%;background-size:auto;background-repeat:no-repeat;background-position: 50% 50%;}
.img_list li .txt_box .img img{width:-webkit-fill-available;transition:.5s;}
.img_list li .txt_box:hover  img {transform:scale(1);}
.img_list li .txt_box .num4 {width: 80px;height: 60px;line-height:60px;text-align: center;background-color:#b79480;color:#fff;border-radius:50px;font-weight:500;font-size:22px;font-family: 'Circe', sans-serif;position: absolute;margin-left: -21%;top: -5%;}
.img_list li .txt_box .num5 {width: 120px;height: 45px;line-height:45px;text-align: center;background-color:#b79480;color:#fff;border-radius:50px;font-weight:500;font-size:18px;font-family: 'Circe', sans-serif;}



.pl70 { padding-left:70px;}
.pr70 { padding-right:70px;}
.pl20 { padding-left:20px;}



@media all and (max-width:1200px){

}
@media all and (max-width:1024px){
#sv {margin-top: 80px;}
#sv .visual {width: 100%; height: 350px; background-position: 55% 50%; background-image: url('../images/sub/sv.jpg'); background-repeat: no-repeat;  background-size:cover; transform:scale(1.3); animation: sv-bg-change 5s infinite;}
#sv .txt_wrap {color: #222;position: absolute;width: -webkit-fill-available;top: 50%;left: 0;margin-left: 10%;-webkit-transform:translateY(-50%);transform:translateY(-50%);/* padding: 0 75px; */z-index: 1;}


}
@media all and (max-width:768px){
.scrollx_768 { overflow-x: auto;  margin-top: 15px;  padding-top: 0;  background: url('/assets/images/sub/bg_hand.gif') 100% 0 no-repeat}
#sv .visual {height: 280px;}
	
.tab {width: -webkit-fill-available;margin: -40px auto 0;text-align: center;font-size: 0;margin-left:0; z-index:1; border-bottom:1px solid #ddd;}
.tab ul { padding: 0 20px;}
.tab li  {display: inline-block; vertical-align: top; margin:0;  width:33%; padding:30px 0; position: relative;}
.tab li a {display: block;text-align: center;font-size: 16px;font-weight: 500;color: #777;border-left: none;transition: .25s;}
.tab li a.active::after {content: '';background-color: #222;width: -webkit-fill-available;height: 4px;position: absolute;top: 75%;left: 0;transform: translate(0%,-50%);}

.title_txt{position: relative;padding-left: 20px;line-height: 1;word-break:keep-all;margin-bottom: 30px;font-size: 18px;font-weight:600;color:#00377b;}
.title_txt:after {content:'';display: block;width: 5px;height: 18px;background-color:#00377b;position: absolute;top: 0;left: 5px;}

.tit_wrap {display: flex;align-items:center;padding:15px 15px;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin-top:-1px;word-break: keep-all;line-height: 150%;} 
.tit_wrap h4 {width: 23%;color:#000;font-weight:700;} 

.sub_tab li {display: table-cell;text-align: center;border: 1px solid #00377b;border-left: none;color:#00377b;font-weight: 700;height:75px;line-height: 150%;padding-top: 15px;}

.con1 { padding:90px 0 70px;}

.con1 .logo { position: absolute; top: 78%; right: 0;}
.con1 .logo img { width:38%; margin-right:15px;}
.con1 .sign img { width:55%;}
.blue_tb td .txt{position: absolute;line-height: 150%;left: 32%;display: inline-block;padding-top: 2.5%;}

.blue_tb th,
.blue_tb td {padding: 15px 20px;border: 1px solid #ddd;display: block;width: 380px;}

.changed_box {width: 100%;border-radius: 15px;padding: 25px 25px;background-color:#f9f9f9;}
.changed_box ul {display: block;flex-wrap: wrap;}
.changed_box ul li {width: -webkit-fill-available;padding: 40px 0;}
        .changed_box ul li:nth-child(1),
        .changed_box ul li:nth-child(2) { }
        .changed_box ul li:nth-child(5),
        .changed_box ul li:nth-child(6) { border: none; padding-bottom: 0;}
.changed_box dl {position: relative;padding-left: 30%;}
.changed_box dl.num1::before { content: ""; display: block; width: 76px; height: 76px; background: url('/assets/images/sub/s21_icon_1.png') no-repeat left; position: absolute; left: 0; top: 33%; transform: translateY(-50%);}
.changed_box dl.num2::before { content: ""; display: block; width: 76px; height: 76px; background: url('/assets/images/sub/s21_icon_2.png') no-repeat left; position: absolute; left: 0; top: 33%; transform: translateY(-50%);}
.changed_box dl dt {font-size: 16px;font-weight:700;line-height:150%;  word-break:keep-all;}
.changed_box dl dd {font-size: 14px;line-height:150%; word-break:keep-all;}
.changed_box .btn {background-color:#444;color:#fff;padding:15px 0;text-align-last:center;width: 85%;margin-top:20px;font-size: 15px;font-weight:500;transition:.25s;}
.changed_box .btn:hover { background-color:#0094e8;}
.changed_box .btn1 { background-color:#00377b; color:#fff; padding:15px 0; text-align-last:center; width:85%; margin-top:20px; font-size:15px; font-weight:500; transition:.25s;}
.changed_box .btn1:hover { background-color:#0094e8;}

.gray_box {background-color:#f9f9f9;padding: 25px 10px 25px;border:1px solid #ddd;border-radius:15px;display: inline-block;align-items: center;width: -webkit-fill-available;}
.gray_box .btn {background-color:#00377b;color:#fff;position: relative;right: 0;padding:10px 20px;transition:.25s;top: 15px;}
.gray_box .btn:hover {background-color:#0094e8; }
.gray_box .btn1 {background-color:#666;color:#fff;position: absolute;right: 4%;padding: 7px 20px;transition:.25s;top: 19px;}
.gray_box .btn1:hover {background-color:#0094e8; }
.gray_box img { display:block; margin-bottom:10px;}
.gray_box span { padding-left:0px !important;}

.ft_form_btn {border: 0;background: #00377b;color: #fff;cursor: pointer;height:45px;line-height:45px;font-size: 14px;font-weight:700;transition: 0.5s;width: 48%;margin:0 auto;display:inline-block;vertical-align: baseline;}
.ft_form_btn:hover {background: #0094e8;}
.ft_form_btn1 {border: 0;background: #fff;color: #00377b8;border:1px solid #00377b;cursor: pointer;height:45px;line-height:45px;font-size: 14px;font-weight:700;transition: 0.5s;width: 48%;margin:0 auto;display:inline-block;vertical-align: baseline;}
.ft_form_btn1:hover {background: #0094e8; color:#fff; border:1px solid #0094e8;}







.partner_list { }
.partner_list li {width: calc(50% - 20px);display: inline-block;margin: 0 8px 30px;}
.partner_list li .icon {transition:.5s;background-color:#fff;text-align: center;}
.partner_list li .icon img {box-shadow:2px 2px 7px 7px rgba(0,0,0,0.08); border-radius:10px;}
.partner_list li .txt {transition:.5s; text-align:center; padding:20px 0 0; background-color:#fff; color:#222;}
.partner_list li:hover {color:#428bca;}

.img_list li {display: block;justify-content:space-between;align-items: center;border-bottom:1px solid #ddd;padding-bottom:50px;margin-bottom:50px;}
.img_list li > div {width: -webkit-fill-available;margin-bottom: 20px;}
.img_list li .txt_box { padding: 0 0 0 5px;}





}

@media all and (max-width:486px){

@media all and (max-width:360px){
.blue_tb th,
.blue_tb td {padding: 15px 20px;border: 1px solid #ddd;display: block;width: 320px;}
.con1 .logo { position: absolute; top:80%; right: 0;}	

}