@font-face {
font-family: 'Gmarket Sans';    font-style: normal;    font-weight: 700;
src: local('Gmarket Sans Bold'), local('GmarketSans-Bold'),
url('http://script.ebay.co.kr/fonts/GmarketSansBold.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('http://script.ebay.co.kr/fonts/GmarketSansBold.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
@font-face {
  font-family: 'Gmarket Sans';    font-style: normal;    font-weight: 500;
  src: local('Gmarket Sans Medium'), local('GmarketSans-Medium'),
  url('http://script.ebay.co.kr/fonts/GmarketSansMedium.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
  url('http://script.ebay.co.kr/fonts/GmarketSansMedium.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* 공통 css */
html body { min-width: 1000px; margin: 0; padding: 0; font-family: "Noto Sans KR",sans-serif; }
ul { margin: 0; padding: 0; }
li { list-style: none; }
a { text-decoration: none; color: inherit; }
div { box-sizing: border-box; }
strong { font-weight: bold !important; }
label { cursor: pointer; }
select { -webkit-appearance: none; cursor: pointer; -moz-appearance: none; appearance: none; filter: alpha(opacity=0); }
select::-ms-expand { display:none; }
select { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
input[type=text] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: "Noto Sans KR",sans-serif; color: #333; outline: none; }
input[type=password] { font-family: "Noto Sans KR",sans-serif; color: #333; outline: none; }
input[type=checkbox] { cursor: pointer; margin:0; }
input[type="radio"] { vertical-align: middle; margin-top: 0; }
textarea { font-family: "Noto Sans KR",sans-serif; color: #333; resize: none; box-sizing: border-box; outline: none; }
.wrap { width: 920px; margin: 0 auto; }
.t_red { color: #f00; }
.mt10 { margin-top: 10px; }

/* 공통메뉴 */
.header { width: 100%; min-width: 1000px; height: 70px; position: absolute; left:0; top:0; z-index: 9; }
.header .logo { display: flex; height: 60px; float: left; margin-right: 100px; }
.header .logo a { display: inline-flex; vertical-align: bottom; align-items: flex-end; }
.header .menu { float: left; }
.header .menu ul { display: flex; height: 60px; }
.header .menu ul li { display: inline-flex; align-items: flex-end; font-size: 20px; font-weight: 500; float: left; margin-right: 70px; }
.header .login_menu { float: right; }
.header .login_menu ul { display: flex; height: 68px; }
.header .login_menu ul li { display: inline-flex; align-items: flex-end; float: left; margin-left: 8px; }
.header .login_menu ul li a { display: block; height: 34px; line-height: 32px; padding: 0 20px; font-size: 13px; color: #444; border: 1px solid #ccc; letter-spacing: -0.03em; box-sizing: border-box; border-radius: 5px; }
.header#main_h { color: #fff; }
.header#main_h .login_menu ul li a { color: #fff; }

/* 서브 공통 */
.container { display: inline-block; width: 100%; height: 100%; padding-bottom: 150px; padding-top: 70px; }
.sub_top { display: inline-block; width: 100%; height: 45px; margin-top: 40px; padding-bottom: 10px; border-bottom: 1px solid #eee; }
.sub_top .sub_title { font-size: 25px; font-weight: 500; float: left; }
.sub_top .sub_btn { float: right; }
.sub_top .sub_btn ul li { display: inline-block; float: left; }
.sub_top .sub_btn ul li a { display: block; height: 34px; line-height: 34px; padding: 0 20px; font-size: 14px; font-weight: bold; color: #fff; background: #3e3e3e; border-radius: 50px; }
.check_con input { display: none; }
.check_con label { padding-left: 25px; height: 15px; line-height: 15px; font-size: 15px; background: url(../images/common/checkbox.png) no-repeat left center; }
.check_con label.on { background: url(../images/common/checkedbox.png) no-repeat left center; }

.talk_con { background: #fff; border-radius: 15px; position: relative; }
.talk_con .kakao_logo { position: absolute; top: -15px; right: -15px; }
.talk_con .msg_title { background: #fee501; color: #5b3e3c; font-size: 15px; padding: 15px 10px; border-top-left-radius: 15px; border-top-right-radius: 15px; }
.talk_wrap { padding: 10px; }
.talk_wrap .talk_title { padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #ddd; }
.talk_wrap .talk_title > p { color: #888; font-size: 15px; margin-bottom: 7px; }
.talk_wrap .talk_title > h1 { color: #222; font-size: 22px; font-weight: 500; }
.talk_wrap .talk_text > p { color: #111; font-size: 15px; margin-bottom: 20px; }
.talk_wrap .info_text > p { color: #888; font-size: 15px; margin-bottom: 15px; }
.talk_wrap .ad_text > p { color: #888; font-size: 15px; margin-bottom: 15px; }
.talk_wrap .talk_btn { width: 100%; height: 35px; line-height: 35px; background: #f2f2f2; border-radius: 5px; text-align: center; font-size: 14px; }
.talk_wrap .talk_btn span { color: #555; }

.content { display: inline-block; width: 100%; padding: 40px 0; }
.content .MAT15 { margin-top: 15px; }
.content .MAT25 { margin-top: 25px; }
h4.cStyle1 { float:left; width:100%; color:#3f4766; font-size:20px; font-weight:500; line-height:22px; }
h5.cStyle1 { float:left; display:inline; width:100%; font-size:15px; font-weight:500; color:#414346; line-height:30px; margin:10px 0 0 0; }
h6.cStyle1 { float:left; display:inline; width:100%; font-size:15px; color:#484d51; line-height:24px; padding:0 0 0 11px; margin:4px 0 0 13px; }

dl.cStyle1 { float:left; display:inline; width:100%; margin:2px 0 0 0px; font-weight:normal; }
dl.cStyle1 dt {float:left; width:98%; font-size:13px; line-height: 20px; color:#6d7174; padding:0 0 0 10px; margin:2px 0 0 0; }
dl.cStyle1 dd {float:left; width:98%; font-size:13px; color:#909396; margin:1px 0 0 0; padding:0 0 0 18px; }
dl.cStyle1 span {float:left; width:95%;font-size:13px; color:#909396; margin:1px 0 0 0; padding:0 0 0 30px; }

p.cStyle1 { float:left; display:inline; width:100%; margin:5px 0 0 0; color:#424547; font-size: 14px; line-height: 20px; }

table.cStyle { float:left; border-top:2px solid #79a2c6; border-bottom:1px solid #dbdbdb; margin:2px 0 0 0; table-layout: fixed;}
table.cStyle th { color:#436788; padding:9px 0 4px 0; font-weight:bold; background:#f6f8fa; border-bottom:1px solid #dbdbdb; }
table.cStyle td { color:#3d3e3f; padding:5px 5px 4px 5px; font-weight:normal; border-bottom:1px solid #dbdbdb; }

table.cStyle1 { float:left; border-top:2px solid #3f4766; table-layout: fixed; }
table.cStyle1 th { color:#303d47; padding: 15px 20px; margin:0; font-size: 15px; font-weight: bold; background:#f5f7ff; border: 1px solid #ccc; vertical-align: middle; }
table.cStyle1 td { color:#3d3e3f; padding: 10px 20px; font-weight:normal; border: 1px solid #ccc; font-size: 13px; line-height: 20px; text-align: center; vertical-align: middle; }

/* 레이어 공통 */
.layer_cover { width: 100%; height: 100%; content: ''; clear: both; background: #111; opacity: 0.7; position: fixed; top: 0; left: 0; z-index: 98; display: none; }
.layer_popup { background: #fff; position: fixed; left: 50%; top: 50%; transform: translate(-50%,-50%); box-shadow: 0px 0px 15px rgba(0,0,0,0.3); opacity: 0; visibility: hidden; z-index: 99; }
.layer_popup.on { opacity: 1; visibility: visible; }
.layer_popup .layer_close { width: 100%; height: 10px; background: #fee501; }
.layer_popup .layer_close a { position: absolute; top: 25px; right: 15px; }
.layer_popup .layer_title { height: 55px; line-height: 55px; font-size: 20px; font-weight: 500; border-bottom: 1px solid #ccc; padding: 0 20px; margin-bottom: 20px; }
.layer_popup .layer_wrap { padding: 0 20px; }
.layer_popup .layer_wrap input { width: 100%; height: 50px; font-size: 16px; color: #3f4766; font-weight: 500; background: none; border: none; outline: none; border-bottom: 1px solid #757575; box-sizing: border-box; margin-bottom: 20px; }
.layer_popup .layer_btn { display: inline-block; width: 100%; text-align: center; }
.layer_popup .layer_btn a { display: inline-block; height: 40px; line-height: 40px; padding: 0 40px; background: #3f4766; color: #fff; }

#find_member { width: 400px; height: 328px; }
#find_member .find_bottom { font-size: 14px; color: #777; text-align: center; margin-top: 10px; margin-bottom: 20px; }
#find_member .find_bottom a { color: #0095ff; }
#find_pw { width: 400px; height: 362px; }
#find_pw .layer_btn { margin-top: 10px; }

.sign_agree_layer { width: 600px; height: 774px; padding: 40px; border-radius: 5px; }
.sign_agree_layer .agree_cont_title { width: 100%; height: 55px; line-height: 55px; text-align: center; margin-bottom: 20px; background: #dfdfdf; }
.sign_agree_layer .agree_cont { width: 100%; height: 560px; padding: 20px; border: 1px solid #ccc; overflow: scroll; color: #333; }
.sign_agree_layer .agree_cont h5 { font-size: 15px; font-weight: bold; margin-bottom: 20px; }
.sign_agree_layer .agree_cont p { font-size: 14px; line-height: 26px; margin-bottom: 20px; }
.sign_agree_layer .agree_cont ul { margin: 20px 0; }
.sign_agree_layer .agree_cont ul li { font-size: 13px; line-height: 24px; padding-left: 10px; }
.sign_agree_layer .agree_cont_btn { display: inline-block; width: 100%; text-align: center; margin-top: 25px; }
.sign_agree_layer .agree_cont_btn a { display: inline-block; height: 45px; line-height: 45px; padding: 0 40px; font-size: 13px; background: #3f4766; color: #fff; border-radius: 5px; }

/* 메인 */
.visual_wrap { position: relative; display: inline-block; width: 100%; height: 790px; overflow: hidden; }
.visual_wrap .visual { width: 100%; height: 790px; position: absolute; top:0; left:0; transform: scale(1.2); }
.visual_wrap .visual.active { transform: scale(1.0); transition: 5s; transition-delay: 1s; z-index: 1; }
.visual_wrap .visual.bg01 { background: url(../images/contents/bg01.png) no-repeat 50% 50%; background-size: cover; }
.visual_wrap .visual.bg02 { background: url(../images/contents/bg02.png) no-repeat 50% 50%; background-size: cover; }
.visual_wrap .visual.bg03 { background: url(../images/contents/bg03.png) no-repeat 50% 50%; background-size: cover; }
.visual_wrap .visual_con { position: absolute; left:0; top:0; display: table; width: 100%; height: 90%; z-index: 2; opacity: 0; visibility: hidden; }
.visual_wrap .visual_con.show { opacity: 1; visibility: visible; }
.visual_wrap .visual_con .visual_text { display: table-cell; vertical-align: middle; color: #fff; text-align: center; }
.visual_wrap .visual_con .visual_text h1 { font-size: 52px; font-weight: bold; margin-bottom: 40px; position: relative; top: -50px; opacity: 0; }
.visual_wrap .visual_con .visual_text h2 { font-size: 38px; font-weight: 500; position: relative; top: -50px; opacity: 0; }
.visual_wrap .visual_con .visual_text h3 { font-size: 30px; font-weight: 300; line-height: 46px; position: relative; top: -50px; opacity: 0; }
.visual_wrap .visual_con .visual_text span { width: 1px; height: 0px; background: #eee; display: inline-block; margin: 40px 0; opacity: 0; }
.visual_wrap .visual_con .visual_text.active h1 { top: 0px; opacity: 1; transition: 1s; }
.visual_wrap .visual_con .visual_text.active h2 { top: 0px; opacity: 1; transition: 1s; transition-delay: 0.5s; }
.visual_wrap .visual_con .visual_text.active h3 { top: 0px; opacity: 1; transition: 1s; transition-delay: 1.5s; }
.visual_wrap .visual_con .visual_text.active span { height: 100px; opacity: 1; transition: 1s; transition-delay: 1s; }
.visual_wrap .visual_btn { position: absolute; left: 0; bottom: 100px; width: 100%; height: 70px; display: inline-block; text-align: center; z-index: 3; }
.visual_wrap .visual_btn a { display: inline-block; width: 280px; height: 70px; line-height: 68px; font-size: 18px; font-weight: 500; border-radius: 5px; box-sizing: border-box; margin: 0 10px; }
.visual_wrap .visual_btn a:first-child { background: #fee501; color: #5b3e3c; border: 1px solid #fee501; }
.visual_wrap .visual_btn a:last-child { background: none; color: #fff; border: 1px solid #fff; }

.contents { padding: 50px 0; background: #f8f8f8; }
.contents .con_title { text-align: center; }
.contents .con_title h1 { font-size: 40px; font-weight: 500; color: #333; margin-bottom: 25px; }
.contents .con_title h2 { font-size: 20px; color: #333; }
.contents .con_nav { text-align: center; margin-top: 60px; margin-bottom: 40px; }
.contents .con_nav ul li { display: inline-block; margin: 0 20px; }
.contents .con_nav ul li a { display: block; font-size: 20px; font-weight: bold; color: #888; padding: 0 5px; padding-bottom: 10px; }
.contents .con_nav ul li a:hover { border-bottom: 1px solid #888; }
.contents .con_nav ul li.this a { border-bottom: 2px solid #3f4766; color: #3f4766; }

.contents .con_wrap { display: inline-block; width: 100%; height: 600px; }
.contents .con_wrap .service_con .sv_text_wrap { width: calc(100% /3); float: left; margin-top: 50px; }
.contents .con_wrap .service_con .sv_img { margin-bottom: 40px; }
.contents .con_wrap .service_con .sv_text { text-align: center; }
.contents .con_wrap .service_con .sv_text h1 { font-size: 24px; margin-bottom: 20px; }
.contents .con_wrap .service_con .sv_text p { font-size: 17px; line-height: 30px; }
.contents .con_wrap .info_con { display: flex; width: 100%; height: 100%; justify-content: space-between; align-content: space-between; flex-wrap: wrap; }
.contents .con_wrap .info_con .info_wrap { width: calc(50% - 10px); height: calc(50% - 10px); border: 1px solid #aaa; border-radius: 20px; padding: 30px; text-align: center; position: relative; }
.contents .con_wrap .info_con .info_wrap h2 { position: absolute; top: 10px; left: 10px; width: 40px; height: 40px; line-height: 40px; font-size: 19px; font-weight: bold; color: #3f4766; background: #e4e5e8; border-radius: 50px; }
.contents .con_wrap .info_con .info_wrap h1 { font-size: 24px; font-weight: 500; color: #3f4766; margin-bottom: 20px; }
.contents .con_wrap .info_con .info_wrap p { font-size: 17px; line-height: 24px; }
.contents .con_wrap .info_con .info_wrap span { display: inline-block; font-size: 15px; line-height: 22px; color: #263d68; }
.contents .con_wrap .info_con .info_wrap b { display: inline-block; width: 0; height: 0; border: 6px solid transparent; border-left-color: #263d68; margin-left: 6px; }
.contents .con_wrap .info_con .info_wrap a { position: absolute; left:50%; bottom: 30px; transform: translate(-50% ); width: 370px; height: 45px; line-height: 45px; color: #fff; background: #3f4766; border-radius: 5px; }

 /* 로그인 */
 .login_table { display: table; width: 100%; height: calc(100vh - 56px); background: #f8f8f8; }
 .login_table .wrap { display: table-cell; vertical-align: middle; }
 .login_table .login_box { width: 380px; margin: 0 auto; }
 .login_table .login_box .login_title { text-align: center; margin-bottom: 80px; }
 .login_table .login_box .login_title h1 { font-size: 28px; margin-bottom: 15px; }
 .login_table .login_box .login_title h2 { font-size: 34px; font-weight: 500; }
 .login_table .login_box .login_title h2 b { color: #aaa; }
 .login_table .login_box .login_input { width: 100%; height: 50px; font-size: 16px; color: #3f4766; font-weight: 500; background: none; border:none; outline: none; border-bottom: 1px solid #757575; box-sizing: border-box; margin-bottom: 10px; }
 .login_table .login_box .save_id { float: left; height: 40px; line-height: 40px; font-size: 15px; }
 .login_table .login_box .find_member { float: right; height: 40px; line-height: 40px; font-size: 15px; }
 .login_table .login_box .login_btn { display: inline-block; width: 100%; margin-top: 20px; }
 .login_table .login_box .login_btn a { display: block; width: 100%; height: 50px; line-height: 50px; font-size: 15px; font-weight: 500; text-align: center; border-radius: 5px; }
 .login_table .login_box .login_btn a:first-child { background: #fee501; color: #5b3e3c; margin-bottom: 10px; }
 .login_table .login_box .login_btn a:last-child { background: #3f4766; color: #fff; }

/* 회원가입 */
.login_table .join_box { width: 380px; margin: 0 auto; padding: 40px; border: 1px solid #ccc; }
.login_table .join_box .join_input { width: 100%; height: 50px; font-size: 16px; color: #3f4766; font-weight: 500; background: none; border:none; outline: none; border-bottom: 1px solid #757575; box-sizing: border-box; margin-bottom: 10px; }
.login_table .join_box .join_label { display: block; margin-bottom: 20px; font-size: 14px; color: #dc2c2c; }
.login_table .join_box .login_btn { display: inline-block; width: 100%; }
.login_table .join_box .join_btn a { display: block; width: 100%; height: 50px; line-height: 50px; font-size: 15px; font-weight: 500; background: #3f4766; color: #fff; text-align: center; border-radius: 5px; }
.login_table .join_box .cont_box { margin: 30px 0; color: #333; }
.login_table .join_box .cont_box h1 { font-size: 15px; margin-bottom: 10px; }
.login_table .join_box .cont_box .counsel_label { width: 100%; height: 40px; line-height: 40px; position: relative; padding-left: 25px; }
.login_table .join_box .cont_box .counsel_label.all_agree { border-bottom: 1px solid #ccc; }
.login_table .join_box .cont_box .counsel_label input { position: absolute; top: 50%; left:0; transform: translate(0,-50%); width: 18px; height: 18px; }
.login_table .join_box .cont_box .counsel_label label { vertical-align: top; font-size: 15px; }
.login_table .join_box .cont_box .counsel_label a { font-size: 13px; color: #777; margin-left: 5px; padding-bottom: 2px; border-bottom: 1px solid #ccc; }

/* 알림톡 전송 */
.msg_wrap { position: relative; display: inline-block; width: 100%; }
.msg_wrap .title { display: inline-block; width: 100%; border-bottom: 1px solid #ddd; padding-bottom: 10px; margin-top: 30px; margin-bottom: 10px; }
.msg_wrap .title h1 { font-size: 20px; line-height: 30px; font-weight: 500; color: #222; float: left; }
.msg_wrap .title ul { float: right; }
.msg_wrap .title ul li { float: left; }
.msg_wrap .title ul li a { display: block; font-size: 13px; font-weight: 500; height: 30px; line-height: 30px; padding: 0 15px; background: #eee; border-radius: 50px; margin-left: 5px; }
.msg_wrap .title ul li a#add_ch { background: #fee501; }
.msg_wrap .title ul li a#sup_tp { background: #4a5376; color: #fff; }

.msg_wrap .write_box { display: inline-block; width: 520px; float: left; }
.msg_wrap .write_box .write_con { display: table; height: 60px; }
.msg_wrap .write_box .write_con .write_tit { display: table-cell; vertical-align: middle; width: 130px; }
.msg_wrap .write_box .write_con .write_tit span { font-size: 15px; }
.msg_wrap .write_box .write_con .write_sel { display: table-cell; vertical-align: middle; }
.msg_wrap .write_box .write_con .write_sel select { width: 380px; background: #eee; height: 40px; border: none; border-radius: 5px; padding: 0 20px; box-sizing: border-box; outline: none; }
.msg_wrap .write_box .write_con .write_sel a { display: block; width: 380px; background: #eee; height: 40px; line-height: 40px; border-radius: 5px; padding: 0 20px; box-sizing: border-box; font-size: 13.3px; font-family: sans-serif; }

.msg_wrap .write_box .count_txt { width: 380px; float: right; }
.msg_wrap .write_box .count_txt ul li { margin-top: 10px; color: #777; font-size: 15px; }
.msg_wrap .write_box .count_txt ul li span { display: inline-block; width: 140px; text-align: right; }
.msg_wrap .write_box .count_txt ul li a { display: inline-block; font-size: 13px; border: 1px solid #ccc; padding: 5px 10px; border-radius: 4px; margin-left: 10px; }

.msg_wrap .write_box .rec_box { border: 1px solid #ccc; }
.msg_wrap .write_box .rec_box .rec_top { height: 41px; border-bottom: 1px solid #ccc; }
.msg_wrap .write_box .rec_box .rec_top ul { display: inline-block; width: 518px; }
.msg_wrap .write_box .rec_box .rec_top ul li { float: left; width: 70px; text-align: center; height: 40px; line-height: 40px; background: #f8f8f8; font-size: 15px; border-left: 1px solid #aaa; box-sizing: border-box; }
.msg_wrap .write_box .rec_box .rec_top ul li:nth-child(1) { width: 129px; border-left: none; }
.msg_wrap .write_box .rec_box .rec_top ul li:nth-child(2) { width: 109px; }
.msg_wrap .write_box .rec_box .rec_text { height: 261px; overflow-y: scroll; }
.msg_wrap .write_box .rec_box .rec_text ul { display: inline-block; width: 518px; }
.msg_wrap .write_box .rec_box .rec_text ul li { height: 25px; border-bottom: 1px solid #ccc; }
.msg_wrap .write_box .rec_box .rec_text ul li span { float: left; width: 70px; border-left: 1px solid #ccc; box-sizing: border-box; }
.msg_wrap .write_box .rec_box .rec_text ul li span input { width: 100%; height: 24px; background: #fff; border: none; outline: none; box-sizing: border-box; }
.msg_wrap .write_box .rec_box .rec_text ul li span:nth-child(1) { width: 129px; border-left: none; }
.msg_wrap .write_box .rec_box .rec_text ul li span:nth-child(2) { width: 109px; }
.msg_wrap .write_box .rec_box .rec_ft { height: 35px; background: #f8f8f8; padding: 0 10px; border-top: 1px solid #ccc; }
.msg_wrap .write_box .rec_box .rec_ft span { line-height: 35px; font-weight: bold; font-size: 13px; font-family: "dotum",sans-serif; letter-spacing: -2px; }
.msg_wrap .write_box .rec_box .rec_ft span b { color: var(--yellow); }
.msg_wrap .write_box .rec_box .rec_ft a { display: block; float: right; font-size: 13px; width: 70px; height: 25px; line-height: 25px; text-align: center; background: #4a5376; color: #fff; font-weight: bold; border-radius: 4px; font-family: "dotum",sans-serif; letter-spacing: -2px; margin-top: 5px; }
.msg_wrap .write_box .rec_btn_box ul li { display: inline-flex; justify-content: space-evenly; width: calc(98.6% / 3); height: 40px; line-height: 40px; margin-top: 10px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box; font-size: 15px; transition: 0.3s; }
.msg_wrap .write_box .rec_btn_box ul li:hover { color: #3f4766; border: 1px solid #3f4766; }
.msg_wrap .write_box .rec_btn_box ul li a { display: block; width: 100%; text-align: center; }

.msg_wrap .msg_box_wrap.top { position: fixed; width: 920px; left:50%; top:0; transform: translate(-50%); }
.msg_wrap .msg_box_wrap.bottom { position: absolute; right: 0; bottom: 759px; }
.msg_wrap .msg_box_wrap .msg_box { position: absolute; top:0; right:0; width: 360px; }

.phone_box { width: 100%; height: 589px; background: #fff; padding: 10px; border: 1px solid #aaa; border-radius: 20px; margin-top: 8px; }
.phone_box .phone_con { width: 100%; height: 100%; background: #adc1d2; padding: 10px; border-radius: 15px; box-shadow: 0px 1px 2px rgb(0,0,0,0.3); }
.phone_box .phone_con .talk_scroll { width: 100%; height: 100%; overflow-y: scroll; }
.phone_box .phone_con .talk_con { width: 250px; margin-top: 20px; margin-left: 10px; }

.msg_wrap .send_btn { display: inline-block; width: 100%; text-align: center; margin-top: 20px; }
.msg_wrap .send_btn a { display: inline-block; width: 100%; height: 60px; line-height: 60px; text-align: center; font-size: 18px; font-weight: 500; color: #fff; background: #3f4766; border-radius: 10px; }

.an_msg_box { width: 100%; height: 400px; border: 1px solid #ddd; margin-top: 15px; padding: 20px; }
.an_msg_box.hide { height: 0px; overflow: hidden; padding:0; border: none; }
.an_msg_box .an_msg_top { height: 25px; display: inline-block; width: 100%; margin-bottom: 10px; }
.an_msg_box .an_msg_top .t_type { float: left; height: 25px; line-height: 25px; padding: 0 15px; border-radius: 50px; background: #dfecf3; font-size: 13px; }
.an_msg_box .an_msg_top .t_type.lms { background: #4a5376; color: #fff; }
.an_msg_box .an_msg_top .t_byte { float: right; font-size: 13px; line-height: 25px; }
.an_msg_box .an_msg_top .t_byte b { color: #fe0101; }
.an_msg_box .an_msg { width: 250px; height: 100%; border: 1px solid #aaa; border-radius: 15px; padding: 10px; float: left; }
.an_msg_box .an_msg textarea { width: 100%; height: 300px; border: none; background: #f5f5f5; border-radius: 15px; padding: 20px; font-size: 14px; letter-spacing: -0.03em; box-shadow: 0px 0px 3px rgb(0,0,0,0.3); }
.an_msg_box .an_btn_box { width: 200px; float: right; }
.an_msg_box .an_btn_box .an_msg_type { display: inline-block; width: 100%; border-bottom: 1px solid #ccc; padding-bottom: 15px; margin-bottom: 15px; }
.an_msg_box .an_btn_box .an_msg_type li { float: left; margin-right: 20px; }
.an_msg_box .an_btn_box .an_msg_type li:last-child { margin:0; }
.an_msg_box .an_btn_box .an_msg_type li input { display: inline-block; margin-left: 0; vertical-align: bottom; }
.an_msg_box .an_btn_box > ul > li { margin-bottom: 10px; }
.an_msg_box .an_btn_box > ul > li a { display: block; width: 200px; height: 40px; line-height: 40px; text-align: center; border: 1px solid #ccc; border-radius: 5px; font-size: 15px; transition: 0.3s; }
.an_msg_box .an_btn_box > ul > li a:hover { background: #3f4766; color: #fff; }
.an_msg_box .emoticon_box { display: inline-block; width: 100%; height: 205px; padding: 10px; border-radius: 5px; border: 1px solid #ccc; background: #fff; }
.an_msg_box .emoticon_box ul li { display: inline-flex; justify-content: space-evenly; float: left; width: 12.5%; height: 20px; line-height: 20px; }
.an_msg_box .emoticon_box ul li a { display: block; }

.radio_con { display: inline-block; padding-top: 10px; padding-bottom: 25px; }
.radio_con input { margin-left: 0; }
.radio_con ul > li { float: left; margin-right: 30px; }

.template { position: fixed; top:0; left:-100%; width: 400px; height: 100%; background: #3f4766; padding: 30px; z-index: 99; transition: 0.3s; }
.template.show { left: 0; }
.template .template_top { display: inline-block; width: 100%; position: relative; }
.template .template_top h1 { font-size: 24px; color: #fff; font-weight: 500; }
.template .template_top .template_search { width: 100%; margin-top: 10px; margin-bottom: 20px; }
.template .template_top .template_search input { width: 100%; font-size: 15px; height: 40px; line-height: 40px; background: url(../images/contents/search.png) no-repeat 0% 50%; color: #fff; border:none; border-bottom: 1px solid #fff; padding-left: 30px; box-sizing: border-box; }
.template .template_top .template_search ul li { display: inline-block; margin: 0 2px; }
.template .template_top .template_search ul li a { display: block; height: 24px; line-height: 24px; font-size: 12px; padding: 0 10px; color: #333; background: #fff; border-radius: 50px; margin-top: 15px; font-family: sans-serif; }
.template .template_top .template_search ul li.this a { background: #fee501; color: #222; transition: 0.3s; }
.template .template_top .template_right { position: absolute; top:0; right:0; height: 24px; }
.template .template_top .template_right a { display: inline-block; width: 24px; height: 24px; }
.template .template_top .template_right a.on { background-color: #666 !important; border-radius: 5px; }
.template .template_top .template_right #template_short { background: url(../images/contents/template_short.png) no-repeat 50% 50%; margin-right: 10px; }
.template .template_top .template_right #template_more { background: url(../images/contents/template_more.png) no-repeat 50% 50%; margin-right: 10px; }
.template .template_top .template_right #template_all { background: url(../images/contents/template_all.png) no-repeat 50% 50%; margin-right: 10px; }
.template .template_top .template_right #template_close { background: url(../images/contents/template_close.png) no-repeat 50% 50%; }
.template .template_list { width: 100%; height: 85%; overflow-y: scroll; padding-right: 10px; }
.template .template_list .talk_con { width: 100%; margin-top: 20px; cursor: pointer; }
.template .template_list .talk_con:first-child { margin:0; }
.template.more { width: 800px; }
.template.more .template_list .talk_con { width: calc(50% - 25px); display: inline-grid; margin-right: 20px; }
.template.all { width: 100%; }
.template.all .template_list .talk_con { width: calc(25% - 25px); display: inline-grid; margin-right: 20px; }

/* 공통하단 */
.footer { width: 100%; background: #fff; border-top: 1px solid #ddd; }
.footer .ft_top { font-size: 12px; color: #888; display: flex; align-items: center; gap: 10px; padding-top: 20px; }
.footer .ft_top p { width: 1px; height: 10px; background-color: #ccc; content: ''; }
.footer .ft_left { display: table; height: 55px; float: left; }
.footer .ft_left .ft_logo { display: table-cell; vertical-align: middle; padding-right: 20px; }
.footer .ft_left .copy { display: table-cell; vertical-align: middle; font-size: 12px; color: #888; }
.footer .ft_right { float: right; }
.footer .ft_right ul { display: table; height: 55px; }
.footer .ft_right ul li { display: table-cell; vertical-align: middle; font-size: 13px; }
.footer .ft_right ul li b { font-weight: bold; color: #333; }
.footer .ft_right ul li a { display: block; padding: 0 10px; border-left: 1px solid #ccc; }
.footer .ft_right ul li:first-child a { border: none; }
