@charset "utf-8";

@import url("font.css");
@import url("common.css");

/* 공통 */
.wrapper {width:650px; margin:0 auto;}

section {padding-bottom:100px;}

/* table */
.cm_table {border-bottom:1px solid #DADADA;}
.cm_table .w110 {width:110px;}
.cm_table tbody th,
.cm_table tbody td {font-weight:700; border:1px solid #DADADA;}
.cm_table tbody th {text-align:center; padding:17px 0; border-bottom:0;}
.cm_table tbody td {text-align:left; color:#333; line-height:1.4; padding:16px 16px; border-left:0; border-bottom:0; background:#F9F9F9;}

.red .cm_table tbody th {font-weight:700; color:#E24C4C; background:#FFF0F2; border-color:#FFC0C2}

/* list */
.num_list {padding-inline-start:15px;}
.num_list li {list-style:auto;}
.num_list li + li {margin-top:40px;}
.num_list .cm_table {margin-left:-15px;}

.num_list.no_mg li + li {margin-top:0;}

.numround_list li {display:flex; gap:8px;}
.numround_list li > span {width:30px; height:30px; color:#fff; text-align:center; font-weight:700; background:#F56A6A; border-radius:30px; padding-top:6px;}
.numround_list li > p {flex-grow:1; font-family: 'suit'; line-height:1.5; font-weight:500; padding:4px 0 0 0;}
.numround_list li + li {margin-top:16px;}

.dot_list {padding-inline-start:0; margin-left:21px; font-weight:700; line-height:1.4; color:#555; letter-spacing: -0.32px;}
.dot_list li {list-style:disc;}
.dot_list li + li {margin-top:8px;}

.dash_list li {font-weight:900; color:#666; line-height:1.6; font-size:18px; letter-spacing: -0.36px;}
.dash_list li:before {content:'-'; display:inline-block; margin-right:5px; font-weight:900;}

.kor_list {font-size:15px; line-height:1.6; color:#555; font-family: 'suit';}
.kor_list li {display:flex;}
.kor_list li span {margin-right:8px; font-weight:700;}
.kor_list li + li {margin-top:16px;}

/* button */
.btn_wrap {margin-top:60px;}

.arrow_btn {display:inline-block; padding:12px 36px; border-radius:100px;}
.arrow_btn span {display:inline-block; color:#fff; font-weight:700; line-height:1.5; padding-right:28px; background:url(../images/ico/ico_btn_arrow01.png) no-repeat right center; background-size:20px;}
.arrow_btn.red {background:#F56A6A;}
.arrow_btn.blue {background:#0083E2;}

.more_btn {display:inline-block; color:#fff; font-size:12px; line-height:1.5; font-family: 'suit'; letter-spacing:-.5px; padding:4px 13px; border-radius:100px;}
.more_btn span {display:inline-block; padding-right:15px; background:url(../images/ico/ico_more_btn_w.png) no-repeat right -1px center; background-size:12px;}
.more_btn.red {background:#F56A6A;}
.more_btn.org {background:#F3742C;}
.more_btn.grn {background:#26B766;}
.more_btn.blue {background:#0083E2;}

/* img */
.pic {overflow:hidden;}
.round_pic {border-radius:16px; overflow:hidden;}

/* common */
.more_text {margin-top:24px; line-height:1.5; letter-spacing:-.6px;}
.more_text > strong {display:block; margin-bottom:16px; font-size:20px; font-weight:700;}
.more_text > p {font-family: 'suit';}
.more_text .more_btn {margin-top:24px;}

.more_text.greybox {padding:24px; border-radius:16px; background:#F8F8F8;}
.more_text.greybox > strong {font-size:16px;}

.info_t {margin-bottom:24px; line-height:1.5; letter-spacing:-.6px;}
.info_t + .info_t {margin-top:-8px;}
.info_t.ff_suit {font-family: 'suit';}
.info_t.fw_600 {font-weight:600;}
.info_t strong {font-weight:900;}

.point_red {color:#E24C4C;}

.webzin {text-align:left;}
.webzin > tbody {display:table; width:100%; padding-top:60px;}
.webzin > tbody > tr:not(.footer) {display:table; width:100%; padding-left:34px; padding-right:34px;}
.webzin > tbody > tr + tr {margin-top:100px;}
.webzin > tbody > tr.banner {margin-top:120px;}
.webzin > tbody > tr.banner td {padding:0;}
.webzin > tbody > tr.footer {margin-top:150px;}
.webzin > tbody > tr .main_tit {display:block; width:100%; padding:19.5px 24px; border-radius:16px;}
.webzin > tbody > tr .main_tit h2 {display:block; font-size:22px; font-weight:900; line-height:1.5; padding-left:46px; background-repeat:no-repeat; background-position:left center; background-size:36px;}
.webzin > tbody > tr > td {display:block; padding:24px 16px 0;}
.webzin > tbody > tr > td .num_list li strong {display:block; margin-bottom:16px; font-weight:900; font-size:18px;}
.webzin > tbody > tr > td .num_list li::marker {font-weight:900;}

.webzin tbody .red .main_tit {background:#FFF0F2;}
.webzin tbody .red .main_tit h2 {color:#E24C4C; background-image:url(../images/ico/ico_main_tit01.png);}
.webzin tbody .org .main_tit {background:#FAF1E5;}
.webzin tbody .org .main_tit h2 {color:#E5702E; background-image:url(../images/ico/ico_main_tit02.png);}
.webzin tbody .grn .main_tit {background:#E5FAEE;}
.webzin tbody .grn .main_tit h2 {color:#249C59; background-image:url(../images/ico/ico_main_tit03.png);}
.webzin tbody .blue .main_tit {background:#E5F4FA;}
.webzin tbody .blue .main_tit h2 {color:#0083E2; background-image:url(../images/ico/ico_main_tit04.png);}

.webzin tbody .brown_cafe .main_tit {background:#FBF1E0 url(../images/ico/ico_maintit_cafe01.png) no-repeat right 24px center; background-size:99px;}
.webzin tbody .brown_cafe .main_tit h2 {color:#532D18; padding-left:0;}
.webzin tbody .brown_cafe .main_tit p {margin-top:2px; font-family: 'suit'; color:#613319; line-height:1.5; letter-spacing: -0.28px; font-size:14px;}

/* subpage */
.sub_para01 {padding:70px 34px 0;}

.sub_tit {margin-bottom:60px; text-align:center;}
.sub_tit h2 {font-size:34px; line-height:1.4; color: #453333; font-weight:800; letter-spacing: -1.36px;}
.sub_tit .name_tag {display:inline-flex; align-items:center; justify-content:center; margin-top:20px; font-family: 'suit'; padding:6px 24px; gap:8px; border-radius: 50px; border: 1px solid #EEE; background: #F9F9F9;}
.sub_tit .name_tag ul {display: flex; align-items: center; gap: 4px; color: #888; font-size: 14px; font-weight: 500; /*line-height: 1.8;*/ letter-spacing: -0.35px;}
.sub_tit .name_tag ul li {position:relative; padding-left:6px;}
.sub_tit .name_tag ul li:after {content:''; position:absolute; z-index:1; top:50%; transform:translateY(-50%); left:0; width:1px; height:11px; background:#ccc;}
.sub_tit .name_tag ul li:first-child:after {display:block;}

.con_txt {color: #555; line-height: 1.6; font-family: 'suit'; letter-spacing: -0.32px;}
.con_txt p + p {margin-top:24px;}
.con_txt p.sm_mg {margin-top:8px;}
.con_txt > div + div {margin-top:40px;}
.con_txt div > strong {display:block; margin-bottom:8px; font-weight:900; font-size:18px; color:#000; font-family:'NanumSquareRound';}

.con_list_txt > * + * {margin-top:24px;}

.cm_tittxt.mt60 > div:first-child {margin-top:60px;}
.cm_tittxt.no_tit > div {margin-top:60px;}

.cm_tittxt > div {margin-top:80px;}
.cm_tittxt .cm_tit {margin-bottom:25px; padding-bottom:15px; border-bottom:2px solid #E24C4C;}
.cm_tittxt .cm_tit h3 {display:block; font-size:22px; font-weight:900; line-height:1.5; color:#E24C4C; padding-left:46px; background:url(../images/ico/ico_main_tit01.png) no-repeat left center; background-size:36px;}

.quiz_box {margin-top:24px; padding:40px 34px; border:1px solid #FFF0DD; border-radius:8px; background:#FFFBF6;}
.quiz_box.cm_tittxt > div {margin-top:0;} 
.quiz_box.cm_tittxt .cm_tit {padding-bottom:0; border-bottom:0;}
.quiz_box.cm_tittxt .cm_tit .sub_t {margin-top:24px; font-weight:700; line-height:1.6; color:#F56A6A; font-family: 'suit';}
.quiz_box.cm_tittxt .quiz_txt {display:block; margin-bottom:24px; font-family: 'suit'; font-size:17px; font-weight:600; color:#000;}
/***************************************************************************************************************************************************************/

@media all and (max-width:650px){
	/* 공통 */
    .wrapper {width:100%; margin:0;}
	
	.webzin tbody .brown_cafe .main_tit {padding-right:110px; background-size:79px;}

}

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

@media all and (max-width:480px){
	.num_list {font-size:14px; padding-inline-start:10px;}
	.num_list li + li {margin-top:20px;}
	.num_list .cm_table {margin-left:-10px;}
	
	.numround_list li > span {font-size:12px; width:20px; height:20px; padding-top:3px;}
	.numround_list li > p {padding-top:0; font-size:14px;}
	.numround_list li + li {margin-top:6px;}
	
	.dot_list {font-size:14px;}
	.dot_list li {text-indent:-3px;}
	.dot_list li + li {margin-top:6px;}
	
	.dash_list li {font-size:16px;}
	
	.kor_list {font-size:14px;}
	.kor_list li span {margin-right:5px;}
	.kor_list li + li {margin-top:10px;}
	
	.btn_wrap {margin-top:30px;}
	
	.arrow_btn {padding:10px 20px; font-size:14px;}
	.arrow_btn span {padding-right:24px; background-size:15px;}
	
	.more_btn {font-size:10px;}
	.more_btn span {padding-right:13px; background-position:right -1px top 3px; background-size:9px;}
	
	.cm_table {font-size:14px;}
	.cm_table .w110 {width:80px;}
	.cm_table tbody th {padding:15px 0;}
	.cm_table tbody td {padding:13px 10px;}
	
	.more_text {margin-top:18px;}
	.more_text > strong {margin-bottom:10px; font-size:16px;}
	.more_text > p {font-size:14px;}
	.more_text .more_btn {margin-top:16px;}
	
	.more_text.greybox {padding:18px;}
	.more_text.greybox > strong {font-size:14px;}
	
	.info_t {font-size:18px; font-size:14px;}
	
	.webzin > tbody {padding-top:45px;}
	.webzin > tbody > tr:not(.footer) {padding-left:16px; padding-right:16px;}
	.webzin > tbody > tr + tr {margin-top:70px;}
	.webzin > tbody > tr.banner {margin-top:90px;}
	.webzin > tbody > tr.footer {margin-top:110px;}
	.webzin > tbody > tr .main_tit {padding:15px 16px; border-radius:12px;}
	.webzin > tbody > tr .main_tit h2 {font-size:16px; padding-left:38px; background-size:30px; word-break:keep-all;}
	.webzin > tbody > tr .main_tit h2 br {display:none;}
	.webzin > tbody > tr > td {padding:12px 16px 0;}
	.webzin > tbody > tr > td .num_list li strong {margin-bottom:10px; font-size:14px;}
	
	.info_t {word-break:keep-all;}
	.info_t br {display:none;}
	
	/* subpage */
	.sub_para01 {padding:50px 16px 0;}

	.sub_tit {margin-bottom:40px;}
	.sub_tit h2 {font-size:24px;}
	.sub_tit .name_tag {font-size:14px; padding:2px 18px;}
	.sub_tit .name_tag ul {font-size: 12px;}

	.con_txt {font-size:14px;}
	.con_txt p + p {margin-top:18px;}
	.con_txt p.sm_mg {margin-top:5px;}
	.con_txt > div + div {margin-top:25px;}
	.con_txt div > strong {margin-bottom:5px; font-size:15px;}

	.con_list_txt > * + * {margin-top:18px;}
	
	.cm_tittxt > div {margin-top:60px;}
	.cm_tittxt .cm_tit {margin-bottom:18px; padding-bottom:10px;}
	.cm_tittxt .cm_tit h3 {font-size:16px; padding-left:38px; background-size:30px;}
	
	.quiz_box {margin-top:18px; padding:25px 20px;}
	.quiz_box.cm_tittxt .quiz_txt {margin-bottom:12px; font-size:15px;}
	.quiz_box.cm_tittxt .cm_tit .sub_t {margin-top:18px; font-size:14px; word-break:keep-all;}
	.quiz_box.cm_tittxt .cm_tit .sub_t br {display:none;}
	
}

@media all and (max-width:374px){
	.num_list {padding-inline-start:7px;}
	.num_list .cm_table {margin-left:-7px;}
	
	.dot_list {font-size:13px;}
	
	.dash_list li {font-size:14px;}
	
	.kor_list {font-size:13px;}
	
	.arrow_btn {font-size:13px;}
	
	.cm_table {font-size:13px;}
	
	.more_text > strong {font-size:14px;}
	.more_text > p {font-size:13px;}
	.more_text.greybox > strong {font-size:13px;}
	
	.info_t {font-size:13px;}
	.sub_tit h2 {font-size:22px; word-break:keep-all;}
	.sub_tit h2 br {display:none; word-break:keep-all;}
	
	.webzin > tbody > tr > td {padding:12px 10px;}
	
	.webzin > tbody > tr .main_tit h2 {font-size:14px;}
	.webzin > tbody > tr > td .num_list li strong {margin-right:-9px;}
	
	.cm_tittxt .cm_tit h3 {font-size:14px; padding-left:32px; background-size:25px;}
	
	.quiz_box.cm_tittxt .cm_tit .sub_t {margin-top:15px; font-size:13px;}
}