@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

/*공통*/
body {width:100%; max-width:640px; margin: 0 auto; color:#222; font-family: 'Noto Sans KR', sans-serif; letter-spacing:-1px; background:#fff;}
* {padding:0; margin:0;}
img {border:0; vertical-align:top;}
li {list-style:none;}
a {text-decoration:none; color:#222;}

input {vertical-align:top;}
select {vertical-align:top;}

.clearfix {*zoom:1;}
.clearfix:before, .clearfix:after {display:block; content: ''; line-height: 0;}
.clearfix:after {clear: both;}
.imgbox img {width:100%;}


/*메인*/
.main {width:100%;}

/*헤더*/
.header {width:100%;}


.container {width:100%;}

/*띠배너*/
.bottom_banner {
    width: 100%;
    max-width: 640px;
    position: fixed;
	bottom: 0;}


/*헤드라인*/
.headline {width:100%; padding:4% 3% 0% 3%; box-sizing:border-box;}
.headline i {color:#0082e5; font-size:15px;}
.headline .title {width:100%; font-size:26px; line-height:37px; font-weight:700; margin-top:1%;}
.headline .title span {color:red;}
.headline .subtitle {width:100%; font-size:16px; line-height:24px; font-weight:600; color:#0631a2; margin-top:4%; /*border-left:3px solid #bcbcbc; padding-left:10px; box-sizing:border-box;*/}
.headline .head_info {width:100%; display:flex; height:20px; margin-top:3%; border-bottom: solid 2px #990000; padding-bottom: 2%;}
.headline .head_time {width:100%; text-align: right; font-size:12px; color:#bbb;}



/*기사본문*/
.article {width:100%; /*margin-top:7%;*/ padding:0 3%; box-sizing:border-box; letter-spacing:-0.5px;}
.article p.imgbox {width:100%; margin:7% 0 0 0; box-sizing:border-box;}
.article p.imgbox span.imgbox_r {display:block; text-align:right; width:100%; margin-top:2%; font-size:14px; font-weight:400; color:#999;}
.article p.txtbox {width:100%; margin:7% 0 0 0; box-sizing:border-box; font-size:16px; line-height:26px;}
.article p.txtbox_1 {width:100%; margin:7% 0 0 0; box-sizing:border-box; font-size:23px; line-height:35px; font-weight: bold;}
.article p.vidbox {width:100%; margin:7% 0 0 0; padding-bottom:56.5%; box-sizing:border-box; position:relative;}
.article p.vidbox iframe {width:100%; height:100%; position:absolute; top:0; left:0;}
.article .swiper {margin-top:5%; overflow:hidden;}


.swiper {width:100%; box-sizing:border-box;}
.swiper-wrapper {width:100%; box-sizing:border-box;}
.swiper-slide {width:50%; padding:0 5px; box-sizing:border-box;}
.swiper-slide p {text-align:center; color:#555; font-size:13px;}



/*디비*/
.db {width:100%; margin-top:7%; box-sizing:border-box; position:relative; z-index:999999; background:#fff;}
/*time*/
.datebg { display: inline-block; color:#ffe829; font-weight: bold;}
.datebg2{ display: inline-block; color:#fff; font-weight: 400;}
.date2::after, .date4::after{content:':'; padding-left:7px;}
/*form*/
.userCounter {width:100%; background:#000; text-align:center; height:40px; line-height:40px; margin:0 auto; position:relative; z-index:999999;}
.userCounter > ul > li {font-size: 20px; color:#fff;}
.db > form {width:100%; padding:7% 5%; box-sizing:border-box; border-left:5px solid #000; border-right:5px solid #000; border-bottom:5px solid #000;}
.db2 > form {border-left:5px solid #3664c7; border-right:5px solid #3664c7; border-bottom:5px solid #3664c7;}
.checkbox {width:100%; padding:0 0 10px 0; border-bottom:2px dotted #e2e2ec;}
.formQqestion {width:100%; display: flex; font-size: 17px; height: 38px; line-height: 38px; font-weight: bold}
.formQqestion .check_2 {margin-top:15px;}
.formQqestion .check_q {width:100%; font-size:16px; margin-bottom:10px;}
.formQqestion .check_l {width:100%; display:flex; flex-direction:row; flex-wrap:wrap; font-size:14px;}
.formQqestion .check_l > div {width:25%; margin-bottom:5px;}
.formQqestion input[type=checkbox], .formQqestion input[type=radio] { display: none; }
.formQqestion input ~ label { background: #fff; display: inline-block; width: 90%; height: 35px; line-height: 35px; border-radius: 30px; text-align: center; box-sizing: border-box; color: #a4a6b5; font-size: 14px; transition: all .5s; margin-right: 5px; }
.formQqestion input:checked + label {background:#ff2b2b; color:#fff;}
.area {width: 25%; display: inline-block; }
.area input {vertical-align: baseline; margin-right: 3%;}
.inputbox {width:100%; margin-top:3%;}
.inputbox > div {width:100%; display:flex; font-size:16px; height:38px; line-height:38px; margin-top:10px;}
.inputbox > div:nth-child(1) {margin-top:0;}
.inputbox > div > div:nth-child(1) {width:25%; height:100%; font-weight:600;}
.inputbox > div > div:nth-child(2) {width:75%; height:100%;}
.inputbox > div > div:nth-child(2) > input {width:100%; height:100%; border:1px solid #e2e2ec; box-sizing:border-box; padding-left:10px;}
.inputbox > .tel > div:nth-child(2) > input {width:32%; height:100%; border:1px solid #e2e2ec; box-sizing:border-box; padding-left:10px; margin-left:2%;}
.inputbox > .tel > div:nth-child(2) {font-size:0;}
.inputbox > .tel > div:nth-child(2) > input:nth-child(1) {margin-left:0;}
.db_btn {width:100%; margin-top:5%;}
.db_arrow {width:100%; text-align:center; margin-top:10px;}
.db_pay {width:100%; padding:3% 0; box-sizing:border-box;}
.db_pay .pay_bg {width:100%; background:#f5f5f5; font-size:14px; line-height:20px; text-align:center; padding:20px 0;}
.db_pay .pay_bg input:nth-child(1) {width:25%; margin-bottom:10px;}
.db_agree {width:100%; font-size:12px; text-align:right; color:#999;}




.tel_a {width:100%; padding:7% 7% 0 7%; box-sizing:border-box;}



/*댓글*/
.comment {width:100%; margin-top:7%; padding:0 5px; box-sizing:border-box;}
.co_top1 {width:100%; padding:0 2% 3% 2%; box-sizing:border-box;}
.co_top1 > .co_title {width:100%; font-size:18px; font-weight:600; color:#000;}
.co_top1 > .co_textarea {width:100%; margin-top:3%; box-sizing:border-box; height:40px; line-height:40px; display:flex;}
.co_top1 > .co_textarea > div:nth-child(1) {width:75%; height:100%; box-sizing:border-box; border:1px solid #999;}
.co_top1 > .co_textarea > div:nth-child(1) > textarea {width:100%; height:100%; border:0; padding:5px 10px; box-sizing:border-box; font-size:14px;}
.co_top1 > .co_textarea > div:nth-child(1) > textarea::placeholder {font-size:14px; font-family: 'Noto Sans KR', sans-serif;}
.co_top1 > .co_textarea > div:nth-child(2) {width:25%; height:100%; box-sizing:border-box; border:1px solid #000;}
.co_top1 > .co_textarea > div:nth-child(2) > a {width:100%; height:100%; background:#000; color:#fff; border:0; display:block; text-align:center; font-size:14px;}
.co_box {width:100%; padding:3% 2%; box-sizing:border-box; border-bottom:1px solid #ddd;}
.co_box .co_info {width:100%; font-size:16px;}
.co_box .co_info .time {font-size:12px; letter-spacing:0; font-weight:300; color:#888; padding-left:5px;}
.co_box .co_ment {width:100%; margin-top:5px; font-size:15px; line-height:23px; color:#000;}
.co_box .co_ment .best {display:inline-block; width:44px; height:20px; border-radius:11px; background:red; color:#fff; text-align:center; line-height:20px; font-size:13px; font-weight:300;}
.co_box .co_ment .img {margin-bottom:2%;}
.co_box .co_ment .img > img {height:180px;}
.co_box .co_emo {width:100%; margin-top:5px;}
.co_box .co_emo > ul {width:100%; display:flex; flex-direction: row-reverse;}
.co_box .co_emo > ul > li {width:50px; height:28px; border:1px solid #ddd; border-radius:4px; margin-left:5px;}
.co_box .co_emo > ul > li > a {display:block; width:100%; height:100%; text-align:center; border-radius:4px; font-size:13px; line-height:28px; background:#fafafa;}
.co_box .co_emo > ul > li > a.up {color:#df161d;}
.co_box .co_emo > ul > li > a.down {color:#1563e4;}
.co_box .co_emo > ul > li > a > img {padding-top:5px;}
.co_bottom {width:100%; padding:13px; box-sizing:border-box; text-align:center; background:#eaeaea; border:1px solid #d7d7d7;}
.co_bottom a {font-size:16px; color:#666;}
.co_bottom a b {color:red;}




/*article_list*/
.article_list {width:100%; max-width:640px; margin:30px auto 0; padding:0 3%; box-sizing:border-box;}
.al_title {width:95%; font-size:16px; font-weight:500; color:#555; padding:10px; border-top:1px solid #999; border-bottom:1px solid #999;}

.al01 {width:100%;}
.al01_list {width:100%; margin-top:10px; box-sizing:border-box;}
.al01_list ul {width:100%; display:flex; flex-wrap: wrap;}
.al01_list li {width:50%; box-sizing:border-box; padding:5px 5px;}
.al01_list li a > div:nth-child(1) {width:100%; padding-bottom:66%; background:#fff; position:relative;}
.al01_list li a > div:nth-child(1) img {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%;}
.al01_list li a > div:nth-child(2) {width:100%; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; word-wrap: break-word; height: 3.2em; padding: 5px 4px 0px; box-sizing:border-box; letter-spacing: -1px; font-size:16px;}

.al02 {width:100%; margin-top:15px;}
.al02_list {width:100%; box-sizing:border-box;}
.al02_list li {width:95%; border-bottom:1px solid #f1f1f1;}
.al02_list li a {display:block; width:100%; font-size:15px; letter-spacing:-1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; padding: 7px 20px 7px; margin: 0 -15px; color: #222;}
.al02_list li a > span {display:inline-block; width:17px; height:17px; line-height:16px; background:#673a7d; color:#fff; font-size:12px; text-align:center; margin-right:5px;}



.bottom_ban {width:80px; position:fixed; bottom:10px; right:10px; z-index:999998;}
.bottom_ban02 {width:100%; max-width:640px; position:fixed; bottom:0px; z-index:999997;}




select {
width: 100%;
    height: 100%;
    border: 1px solid #e2e2ec;
    box-sizing: border-box;
    padding-left: 10px;
}






/*실시간 상담현황*/
.counseling {width: 100%; margin: 20px auto; margin: auto; position: relative; z-index: 9999; padding-bottom: 20px; background: #fff;}

.coun {background: #fff; padding-top: 13px; font-family: 'Noto Sans KR', sans-serif; font-size: 19px; letter-spacing: -.6px; font-weight: 500; padding: 27px; border-bottom: 1px solid #ccc; line-height: 2px; font-weight: bold; text-align: left;}

#consult-container > ul {list-style: none; background: #f8f8f8;}

#consult-container > ul > li {height: 40px; list-style: none; margin: 0px; padding: 0px;}

#consult-container > ul > li .t_01 {background: rgb(255, 255, 255); width: 20%; height: 40px; text-align: center; padding-top: 19px; float: left; box-sizing: border-box; background: #f8f8f8;}

#consult-container > ul > li .t_02 {width: 40%; text-indent: 10px; padding-top: 19px; float: left;}

#consult-container > ul > li .t_03 {padding-top: 19px; float: left; color: #7c7c7c; width: 21%;}

#consult-container > ul > li .t_04 > p.orange {background: #9c037a; padding: 0px; border-radius: 5px; padding-top: 10px; padding-bottom: 10px; font-weight: bold; color: #fff;}
#consult-container > ul > li .t_04 {width: 15%; padding: 10px; float: left; text-align: center; box-sizing: border-box; margin: 0; padding: 0;}
#consult-container > ul > li .t_04 > p {background: #b5b5b5; padding: 0px; margin-top: 10px; border-radius: 5px; padding-top: 10px; padding-bottom: 10px; font-weight: bold; font-size: 12px;}
#consult-container > ul > li .t_04 > p.orange {background: #ec3a43; padding: 0px; border-radius: 5px; padding-top: 10px; padding-bottom: 10px; font-weight: bold; color: #fff;}
#consult-container > ul > li {height: 40px; list-style: none; margin: 0px; padding: 0px;}