@charset "UTF-8";

/* === Sub02 === */
.top_btn {position:fixed; right:3%; bottom:40px; width:70px; height: 70px; background: #D50004; border-radius:50%; text-align: center; line-height: 70px;}
.top_btn a {font-size: 18px; font-weight: bold; color: #fff; display:block; width: 100%; height: 100%;}

.sub_visual {width:100%; height: 600px; background: url(../images/sub/sub_visual05.png) no-repeat center center / cover;}
.sub_visual .text {padding-top: 235px; text-align: center;}
.sub_visual .text h2 {font-size: 70px;  line-height: 1; margin: 30px 0 50px; color: #fff;}
.sub_visual .text .loc li {display:inline-block; margin-right: 48px; color: #fff; font-size: 20px; font-weight: 500; line-height: 1; position:relative;}
.sub_visual .text .loc li::after {content:''; width:9px; height: 14px; background: url(../images/sub/sv_arrow.png) no-repeat; position:absolute; right:-32px; top:3px;}
.sub_visual .text .loc li:last-child {margin-right: 0;}
.sub_visual .text .loc li:last-child::after {content:none;}

.sub_menu {text-align: center; font-size: 0;}
.sub_menu li {display:inline-block; width: 160px; height: 70px; line-height: 70px; font-size: 18px; border-bottom:1px solid #ddd;}
.sub_menu li a {color: #555;}
.sub_menu li.on {border-bottom:2px solid #222;}
.sub_menu li.on a {color: #222; font-weight: bold;}
.sub_menu li:hover {border-bottom:2px solid #222;  transition:0.3s ease-in-out;}
.sub_menu li:hover a {color: #222;  transition:0.3s ease-in-out; font-weight: bold;}

#sub_contents {margin-bottom: 120px;}
#sub_contents .contop {margin: 70px 0;}
#sub_contents h3.h3_tit {font-size: 50px; color: #222; text-align: center; line-height: 1; padding-top: 50px; background: url(../images/sub/h3_tit.jpg) no-repeat center top;}

.contents {}
.basic_wrap {}
.basic_wrap .anchor {width: 100%; padding: 40px 60px; background: #f9f9f9; margin-bottom: 60px;}
.basic_wrap .anchor ul li {float:left; width: 20%; text-align: center; margin-top: 5px;}
.basic_wrap .anchor ul li:nth-child(-n+5) {margin-top: 0;}
.basic_wrap .anchor ul li:hover a {color: #D50004; font-weight: bold;}

.basic_wrap .basic {padding-bottom: 60px; margin-bottom: 60px; border-bottom:1px solid #ddd;}
.basic_wrap .basic:last-child {padding-bottom: 0; margin-bottom: 0; border-bottom: 0;}
.basic_wrap .basic .b_top .left {float:left; width: 53%;}
.basic_wrap .basic .b_top .left > span {color: #D50004; font-size: 20px; line-height: 1; font-weight: 700; display:block; margin-bottom: 15px;}
.basic_wrap .basic .b_top .left h4 {color: #222; font-size: 35px; color: #222; line-height: 1; margin-bottom: 40px;}
.basic_wrap .basic .b_top .left h4 span {font-size: 28px;}
.basic_wrap .basic .b_top .left .txt_box {background: #F7F7F7 url(../images/sub/basic_txtbg.png) no-repeat 90% 90%; padding: 30px 50px; min-height:315px;}
.basic_wrap .basic .b_top .left .txt_box em {font-size: 20px; color: #222; font-weight: bold; line-height: 1; width: 67px; float:left; display:block;}
.basic_wrap .basic .b_top .left .txt_box .bullet {float:right; width: calc(100% - 67px); margin-top: -5px;}
.basic_wrap .basic .b_top .left .txt_box .bullet li {font-size: 18px; line-height: 30px; padding-left: 11px; position:relative; margin-bottom: 5px;}
.basic_wrap .basic .b_top .left .txt_box .bullet li::before {content:''; width: 3px; height: 3px; border-radius:50%; background: #555; position:absolute; left:0; top:12px;}
.basic_wrap .basic .b_top .left .txt_box .bullet li:last-child {margin-bottom: 0;}

.basic_wrap .basic .b_top .right {float:right; width: 42%; margin-left: 5%;}
.basic_wrap .basic .b_top .right img {width: 100%;}

.basic_wrap .basic .b_bot {margin-top: 40px;}
.basic_wrap .basic .b_bot .tit {float:left; width: 105px; height: 30px;}
.basic_wrap .basic .b_bot .tit span {display:inline-block; font-size: 20px; font-weight: bold; color: #222; line-height: 30px;}
.basic_wrap .basic .b_bot .tit img {margin-left: 10px; margin-top:6px;}
.basic_wrap .basic .b_bot .clfix {float:right; width: calc(100% - 105px); font-size: 0;}
.basic_wrap .basic .b_bot .clfix li {display:inline-block; font-size: 18px; font-weight: 500; line-height: 30px; margin-right: 30px;}
.basic_wrap .basic .b_bot .clfix li a {color: #999;}
.basic_wrap .basic .b_bot .clfix li:last-child {margin-right: 0;}
.basic_wrap .basic .b_bot .clfix li:hover a {color: #222;}





/* 추가 */
.container .row div p {height: 60px;}

div .pagination .page-item .page-link{font-size:14px; border:none; border-radius:50%; background-color:#FFF; color:#555; margin:1px;}
div .pagination .active .page-link {width:35px; height:35px; border:1px solid #d50004; border-radius:50%; background-color:#d50004; color:#fff;}
div .pagination .page-item .page-link:hover{color:#555; font-weight:bold;}
div .pagination .active .page-link:hover{color:#fff; font-weight:bold;}

div .paginationbar {text-align:center; display:inline-block; margin-bottom:20px;}



@media screen and (max-width:1200px) and (min-width: 1025px){
    .inner {width:100%; padding:0 2%;}
    #header .gnb > li {margin-right:50px;}
    .visual .inner .text {padding:0 2%;}
    .section2 .b_list2 li {padding:0 10px;}
} 





/* ==== tab ==== */
@media screen and (max-width:1024px){
.inner {width:100%; padding:0 3%;}
.pc {display:block;}
.tab {display:block;}
.mob {display:none;}
.pc_img {display:none !important;}
.mob_img {display:block !important;}

/* === Sub === */
.sub_visual {width:100%; height: 500px; background: url(../images/sub/sub_visual02.jpg) no-repeat center center / cover;}
.sub_visual .text {padding-top: 185px; text-align: center;}
.sub_visual .text img {width: 170px;}
.sub_visual .text h2 {font-size: 55px;  line-height: 1; margin: 25px 0 40px; color: #fff;}
.sub_visual .text .loc li {font-size: 18px;}

#sub_contents {margin-bottom: 100px;}
#sub_contents .contop {margin: 60px 0;}
#sub_contents h3.h3_tit {font-size: 40px; padding-top: 45px; background: url(../images/sub/h3_tit.jpg) no-repeat center top;}
}





/* ==== mob ==== */
@media screen and (max-width:767px){
body,th,td,input,select,textarea,button {font-size:12px; line-height:1.5;}
.inner {width:100%; padding:0 3%;}
.pc {display:none !important;}
.tab {display:none}
.mob {display:block !important;}
.pc_img {display:none;}
.mob_img {display:block;}

body,th,td,input,select,textarea,button {font-size:13px; line-height:20px;}





/* === Sub === */
.top_btn {position:fixed; right:3%; bottom:30px; width:50px; height: 50px; line-height: 50px; z-index:99;}
.top_btn a {font-size: 14px;}

.sub_visual {width:100%; height: 350px;}
.sub_visual .text {padding-top: 145px;}
.sub_visual .text img {width: 130px;}
.sub_visual .text h2 {font-size: 40px; margin: 15px 0 30px;}
.sub_visual .text .loc li {margin-right: 35px; font-size: 15px;}
.sub_visual .text .loc li::after {content:''; width:9px; height: 14px; background: url(../images/sub/sv_arrow.png) no-repeat; position:absolute; right:-25px; top:0;}
.sub_visual .text .loc li:last-child {margin-right: 0;}
.sub_visual .text .loc li:last-child::after {content:none;}

.sub_menu {text-align: center; font-size: 0;}
.sub_menu li {display:inline-block; width: 25%; height: 45px; line-height: 45px; font-size: 13px; }

#sub_contents {margin-bottom: 70px;}
#sub_contents .contop {margin: 45px 0 40px;}
#sub_contents h3.h3_tit {font-size: 32px; padding-top: 35px; background: url(../images/sub/h3_tit.jpg) no-repeat center top; background-size:28px 14px;}

.basic_wrap .anchor {padding: 25px 20px; margin-bottom: 40px;}
.basic_wrap .anchor ul li {float:left; width: 25%; text-align: center; margin-top: 7px; font-size: 14px;}
.basic_wrap .anchor ul li:nth-child(-n+5) {margin-top: 7px;}
.basic_wrap .anchor ul li:nth-child(-n+4) {margin-top: 0;}
.basic_wrap .anchor ul li:hover a {color: #D50004; font-weight: bold;}

.basic_wrap .basic {padding-bottom: 30px; margin-bottom: 30px;}
.basic_wrap .basic .b_top .left {float:none; width: 100%;}
.basic_wrap .basic .b_top .left > span {font-size: 15px; margin-bottom: 10px;}
.basic_wrap .basic .b_top .left h4 {font-size: 24px; margin-bottom: 25px;}
.basic_wrap .basic .b_top .left h4 span {font-size: 20px;}
.basic_wrap .basic .b_top .left .txt_box {padding: 20px; min-height:auto;}
.basic_wrap .basic .b_top .left .txt_box em {font-size: 15px; width: 55px;}
.basic_wrap .basic .b_top .left .txt_box .bullet {float:right; width: calc(100% - 55px); margin-top: -3px;}
.basic_wrap .basic .b_top .left .txt_box .bullet li {font-size: 14px; line-height: 22px; padding-left: 11px; position:relative; margin-bottom: 5px;}
.basic_wrap .basic .b_top .left .txt_box .bullet li::before {top:8px;}

.basic_wrap .basic .b_top .right {float:none; width: 100%; margin-left: 0; margin-top: 10px;}
.basic_wrap .basic .b_top .right img {width: 100%;}

.basic_wrap .basic .b_bot {margin-top: 25px;}
.basic_wrap .basic .b_bot .tit {float:left; width: 85px; height: 25px;}
.basic_wrap .basic .b_bot .tit span {display:inline-block; font-size: 16px; line-height: 25px;}
.basic_wrap .basic .b_bot .tit img {margin-left: 10px; margin-top:6px; width: 20px;}
.basic_wrap .basic .b_bot .clfix {float:right; width: calc(100% - 85px); font-size: 0;}
.basic_wrap .basic .b_bot .clfix li {display:inline-block; width: 50%; font-size: 14px; font-weight: 500; line-height: 25px; margin-right: 0;}
}

