@charset "utf-8";

/*리셋*/
*{margin: 0; padding: 0; border: 0; outline: 0;}
*,*::after,*::before {box-sizing: border-box;}
ul,li{list-style: none;}
a{text-decoration: none;  display: block;}
img{border: 0;}
html{overflow-x:hidden;}

/*지정*/
.fl{float: left;}
.fr{float: right;}
.cf:before{content: ''; display: block; clear: both;} .cf:after{content: ''; display: block; clear: both;}


/* font */
body{font-family: 'Noto Sans KR', sans-serif;}
@font-face {
    font-family: 'GmarketSansLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSansBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'KOTRA_BOLD-Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10-21@1.1/KOTRA_BOLD-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

h3,h4{font-family: 'KOTRA_BOLD-Bold';}

/*홈버튼*/
#home_btn{width: 100px; height: 100px; background-color: #ff4356; border-radius: 50%; position: fixed; bottom: 30px; right: 30px; border: 2px solid #ffffff; text-align: center; transition: .2s; z-index:999;}
#home_btn .img{width: 40px; height: 40px; background: url(../images/sub/icon2-w.png) no-repeat center; background-size: cover; margin: 18px auto 5px auto;}
#home_btn p{color: #ffffff; font-weight: 600; margin-top: -5px;}

#home_btn:hover{background-color: #FFE353;}
#home_btn:hover .img{background: url(../images/sub/icon2.png) no-repeat center; background-size: cover;}
#home_btn:hover p{color: #222222;}



/*header*/
#wrap{margin: 0 auto; width:100%; height:auto; overflow:hidden;}
.fixed_header{width: 100%; height: 630px; background-color: #FEF6CE;}
.fixed_header .container{position:relative; width:100%; height:100%;}
.bg_span{width: 100%; height: 370px; background: url(../images/sub/bg_top.png) no-repeat left top; background-size: cover; position: absolute;}
.tit{width: 1000px; height: 550px; margin: 0 auto; position: relative; z-index: 1;}

.tit .text_box{width: 60%; height: 100%; padding-top: 150px;}
.tit .text_box p:first-child{font-family: 'GmarketSansMedium';font-size: 45px; letter-spacing: -1px; margin-bottom: 15px;}
.tit .text_box p:last-child{font-family: 'GmarketSansBold';font-size: 80px; letter-spacing: -1px; line-height: 1.2;}
.tit .text_box p span{color:#ff4356;}

.tit .img_box{width: 40%; height: 100%; text-align: center; padding-top: 50px;}
.tit .img_box img{width: 70%;}

.tab{width: 100%; height: 80px;}
.tab ul{width: 1135px; height: 80px; margin: 0 auto;}
.tab ul li{width: 280px; height: 80px; border-radius: 50px 50px 0 0; background-color: #ff4356; float: left; margin-right: 5px;}
.tab ul li:last-child{margin-right: 0px;}
.tab ul li a{line-height: 80px; text-align: center; font-size: 23px; font-weight: 600; color: #ffffff; }
.tab ul li.active{height: 83px; background-color: #ffffff; border: 3px solid #ff4356; border-bottom: 0; position: relative; z-index: 100;}
.tab ul li.active a{color: #ff4356;}


/*contents*/
.contents{width: 100%; height: 1000px; background-color: #FEF6CE;}
.tab_con_wrap{width: 1300px; height: 900px; background-color: #ffffff; border: 3px solid #ff4356; border-radius: 80px; margin: 0 auto; position: relative;}
.tab_con{background-color: #ffffff; border-radius: 50px; position: absolute; top: 0; left: 50%; transform:translateX(-50%);}


.con_tit{width: 1050px; height: 70px; font-family: 'GmarketSansBold'; color: #ff4356; margin: 50px auto 0 auto;}
.con_tit .con_tit_l{width: 240px; font-size: 39px; margin-right: 15px; margin-top: -10px; text-align: center;}
.con_tit .con_tit_l span{font-size: 24.3px; display: block; margin-top: -10px;}
.con_tit_r .line{width: 795px; height: 5px; background-color: #ff4356; margin-top: 40px;}

.inner_box{width: 1050px; height: 700px; margin: 0 auto; padding: 20px 0;}
.inner_box_l{width: 50%; height: 660px; text-align: center; padding: 30px 20px;}
.inner_box_l h3{font-size: 25px;}
.inner_box_l p{font-size: 20px; line-height: 1.2; padding:20px;}

table{margin: 0 auto;}
.table1{padding: 20px 0;}
.table1 tr th{border-radius: 20px 20px 0 0; background-color:#F9BCBC; height: 40px;}
.table1 tr th:nth-child(1){width: 100px;}
.table1 tr th:nth-child(2){width: 140px;}
.table1 tr th:nth-child(3){width: 150px;}
.table1 tr:nth-child(2) td{background-color: #FBDDDD; height: 40px;}
.table1 tr:nth-child(3) td{background-color: #FBECEC; height: 40px; color: #ff4356;}

.table2 tr th{border-radius: 20px 20px 0 0; background-color:#F9BCBC; height: 40px;}
.table2 tr th:nth-child(1){width: 160px;}
.table2 tr th:nth-child(2){width: 233px;}
.table2 tr:nth-child(2) td{background-color: #FBDDDD; height: 40px;}
.table2 tr:nth-child(3) td{background-color: #FBECEC; height: 40px; color: #ff4356; font-weight: 600;}
.table2 tr:nth-child(4) td{background-color: #F8F4F4; height: 40px; color: #8E002B; font-weight: 600;}

.inner_box_r{width: 50%; height: 660px; background: url(../images/sub/tag_b.png) no-repeat center; background-size: 110%; text-align: center;}
.inner_box_r_top{width: 100%; height: 315px; padding: 100px 0;}
.inner_box_r_top h4{width: 410px; font-size: 20px; background:linear-gradient(180deg,#ffffff 60%,rgba(255,67,86,0.3) 40%); margin: 0 auto;}

.inner_box_r_top .icon_list{width: 395px; height: 90px; margin: 25px auto; font-family: 'GmarketSansMedium'; font-size: 15px; line-height: 18px;}
.inner_box_r_top .icon_list li.first{margin-left:50%; transform:translateX(-50%);}
.inner_box_r_top .icon_list li{float: left; margin-right: 20px;}
.inner_box_r_top .icon_list li:last-child{margin-right: 0px;}
.inner_box_r_top .icon_list img{width: 50px; height: 50px;}


.table3{padding: 10px 0 5px 0;}
.table3 tr th{background-color: #F9BCBC; height: 25px; font-size: 14px;}
.table3 tr:nth-child(1) th{border-radius: 20px 20px 0 0; height: 30px;}

.table3 tr th:nth-child(1){width:85px;}
.table3 tr th:nth-child(2){width:100px;}
.table3 tr th:nth-child(3){width:130px;}
.table3 tr th:nth-child(4){width:130px;}

.table3 tr td{background-color: #ffffff; height: 25px; font-size: 13px;}

.inner_box_r_bottom p:first-child{font-size:18px; color: #ffffff; line-height: 1.3;}
.inner_box_r_bottom p:last-child{font-size: 13px; color: #FED4D4;}