@charset "utf-8";
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;}body{line-height:1;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}nav ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;text-decoration:none;cursor:pointer;outline:none;}ins{background-color:#ff9;color:#000;text-decoration:none;}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold;}del{text-decoration:line-through;}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help;}table{border-collapse:collapse;border-spacing:0;}hr{display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0;}input,select{vertical-align:middle;}html{box-sizing:border-box;}*,*:before,*:after{box-sizing:inherit;}ul,ol{list-style:none}img,fieldset,iframe{border:0 none;vertical-align:top;}a{text-decoration:none;cursor:pointer;outline:none;}

/* 폰트 설정 */
@font-face {font-family:'NanumSquare';src:url(fonts/NanumSquareR.eot);src:url(fonts/NanumSquareR.woff2) format('woff2'),url(fonts/NanumSquareR.woff) format('woff'),url(fonts/NanumSquareR.ttf) format('truetype');}
body{font-size:12px;line-height:1.25;font-family:"NanumSquare","나눔고딕","NanumGothic","맑은고딕",Arial,sans-serif;}

/* float */
.f_left{float:left;}.f_right{float:right;}
.f_right:after { clear: both }

/* margin */
.ml_6{margin-left:6px;}.ml_10{margin-left:10px;}.ml_15{margin-left:15px;}.ml_20{margin-left:20px;}.ml_25{margin-left:25px;}.ml_30{margin-left:30px;}.ml_35{margin-left:35px;}.ml_40{margin-left:40px;}.ml_50{margin-left:50px;}.ml_55{margin-left:55px;}.mt_6{margin-top:6px;}.mt_10{margin-top:10px;}.mt_15{margin-top:15px;}.mt_20{margin-top:20px;}.mt_25{margin-top:25px;}.mt_30{margin-top:30px;}.mt_35{margin-top:35px;}.mt_40{margin-top:40px;}.mt_50{margin-top:50px;}.mt_55{margin-top:55px;}.mr_6{margin-right:6px;}.mr_10{margin-right:10px;}.mr_15{margin-right:15px;}.mr_20{margin-right:20px;}.mr_25{margin-right:25px;}.mr_30{margin-right:30px;}.mr_35{margin-right:35px;}.mr_40{margin-right:40px;}.mr_50{margin-right:50px;}.mr_55{margin-right:55px;}.mb_6{margin-bottom:6px;}.mb_10{margin-bottom:10px;}.mb_15{margin-bottom:15px;}.mb_20{margin-bottom:20px;}.mb_25{margin-bottom:25px;}.mb_30{margin-bottom:30px;}.mb_35{margin-bottom:35px;}.mb_40{margin-bottom:40px;}.mb_50{margin-bottom:50px;}.mb_55{margin-bottom:55px;}

/*=========================================================================================================
* 관리자 : admin -> a_
* 사용자 : main -> m_
=========================================================================================================*/
:root {
  --main-bg-color: #ffffff;
  --main-txt-color: #585858;
}

a:link, a:hover, a:active, a:visited {
	color: var(--main-txt-color);
}

html, body { height: 100%; }

body { -webkit-overflow-scrolling: touch; xbackground: #f5f5f5; }
body .m_page { font-size: 14px; color: var(--main-txt-color); text-align: center; background: #ffffff;}
body .a_page { font-size: 14px; color: var(--admin-txt-color); text-align: center; background: #f4f4f4;}
body .a_login { font-size: 14px; color: var(--admin-txt-color); text-align: center; background: #f5f5f5; }

/* 사용자 설정 */
.m_page .wrapper { min-width: 300px; }
.m_page .container { width: 100%; }

.m_page .inner { margin: 0 auto; padding: 0 20px; max-width: 1064px; position: relative; overflow: hidden; }
.m_page .mobile .inner { padding: 0; max-width: 100%; width: 100%; }

/* 관리자 설정 */
.a_page .wrapper { background: #f4f4f4; min-width: 1400px; overflow: hidden; position: relative; }
.a_page .container { padding: 80px 0px 46px 160px; background: #fff;  }
.a_page .contents { padding: 15px 24px 0;position: relative; overflow: hidden; }

@media all and (min-width: 0px) and (max-width: 599px){
}

@media all and (min-width: 0px) and (max-width: 799px){
	.m_page .inner { padding: 0 5px; }
}

@media all and (min-width:768px) and (max-width:1024px) {
	.m_page .wrapper { min-width: 768px; }
}




[type="radio"]:checked,
[type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;

    padding-right: 20px;
}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #ddd;
    border-radius: 100%;
    background: #fff;
}
[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: #0f4c81;
    position: absolute;
    top: 4px;
    left: 4px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}





[type="checkbox"]:checked,
[type="checkbox"]:not(:checked) {
    position: absolute;
    left: -9999px;
}
[type="checkbox"]:checked + label,
[type="checkbox"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;

    padding-right: 10px;
}
[type="checkbox"]:checked + label:before,
[type="checkbox"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #ddd;
/*     border-radius: 100%; */
    background: #fff;
}
[type="checkbox"]:checked + label:after,
[type="checkbox"]:not(:checked) + label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: #0f4c81;
    position: absolute;
    top: 4px;
    left: 4px;
/*     border-radius: 100%; */
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
[type="checkbox"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="checkbox"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}


/* 해더 */
.header { }
.header .inner { overflow: visible; }

/* blue 메뉴박스 */
.topheader { padding: 15px 0px; overflow: hidden;}
.topheader .service_name { line-height: 50px; font-size: 15px; font-weight: bold; }

/* 오른쪽메뉴 */
.left_menu { float: left ;}
.left_menu h2 { display: inline-block; height: 30px; line-height: 30px; font-size: 18px; color: #000; vertical-align: middle; }
.left_menu span { font-size: 12px; font-weight: normal;}

.right_menu { float: right; line-height: 50px; /* width: 100%; position: absolute; top: 14px; right: 20px; z-index:1;  */}
.right_menu .profile_name { font-weight: bold; }
.right_menu .profile_level { font-weight: bold; }

.right_menu > ul { margin-left: 10px; margin-right: 5px; margin-top: 5px; overflow: hidden; float: right; }
.right_menu > ul > li { width: 40px; height: 40px; float: left; position: relative; overflow: hidden; }
.right_menu > ul > li.myinfo { cursor: pointer; }
.right_menu > ul > li.myinfo .cover { display: inline-block; width: 100%; height: 100%; background: url(../img/bluecover.png) no-repeat left top; position: absolute; top:0; left:0; background-size: 100% auto; }
.right_menu > ul > li.myinfo img { border-radius: 30px; width: 100%; }

/* 프로필메뉴 */
.myinfo_menu { display: none; position: absolute; right:0; top: 48px; z-index: 10; }
.myinfo_menu .menuinner { margin-top: 9px; padding: 6px 22px 2px; width: 138px; position: relative; overflow: hidden; background: #fff; box-shadow: 5px 5px 24px rgba(0,0,0,0.2);}
.myinfo_menu .menuinner p { border-bottom: 1px solid #e9e9e9;}
.myinfo_menu .menuinner p a { display: inline-block; padding: 16px 2px 15px; width: 100%; }
.myinfo_menu .menuinner p.logout {border-bottom: 0; xbackground: url(../img/logout_ico.png) no-repeat right center; }
.myinfo_menu .menuinner ul { padding: 9px 0; border-bottom: 1px solid #e9e9e9;}
.myinfo_menu .menuinner ul:last-child {border-bottom: 0px; }
.myinfo_menu .menuinner ul li { text-align: left;  }
.myinfo_menu .menuinner ul li a { display: inline-block; padding: 7px 2px; }
.myinfo_menu .menuinner p a:hover,
.myinfo_menu .menuinner ul li a:hover {color: #0f4c81;}
.myinfo_menu .toparrow { width: 13px; height: 9px; position: absolute; top:0; right: 18px; background: url(../img/toparrow.png) no-repeat left top; }
.mob .myinfo_menu { top: 45px; right: 13px; }
.mob .myinfo_menu .toparrow { right: 13px; }

/* 푸터 */
.footer { background: #eee; padding: 15px 0;  text-align: center;}
.footer ul { padding: 10px 0; overflow: hidden;}
.footer ul li { display: inline-block;  padding-left: 8px; margin-left: 8px; height: 12px; line-height: 12px; border-left: 1px solid #c3c3c3; }
.footer ul li:first-child { padding-left: 0; margin-left:0; border-left: 0; }
.footer ul li a { font-size: 12px; color: #585858; line-height: 12px; }
.footer ul li a:hover { color: #007be6; }
.footer .copyright { font-size: 8px; color: #8c8c8c; line-height: 14px; }

.titlebox { margin-bottom: 8px; overflow: hidden; clear: both; }
.titlebox h2 { display: inline-block; margin-right: 10px; height: 33px; line-height: 33px; font-size: 18px; color: #000; vertical-align: middle; }
.titlebox span { font-size: 13px; }
.titlebox .gray { color: #a2a2a2; }
.titlebox .black { color: #585858; }
.titlebox .report_total_count { margin-right: 6px; color: #a2a2a2; cursor: pointer; }
.titlebox .btn_gray { display: inline-block; padding: 8px 13px; font-size: 12px; color: #585858; border: 1px solid #e1e1e1; border-radius: 2px; background: #fafafa; text-align: center; vertical-align: middle; }
.titlebox .btn_gray:hover { background: #0f4c81; color: #fff; border: 1px solid #0f4c81; }
.titlebox .btngray { margin-right: 6px; color: #a2a2a2; cursor: pointer; }
.titlebox .btngray.on { color: #0f4c81; }
.titlebox .btngray:hover { color: #0f4c81; }
.titlebox .btngray.bar { padding-left: 8px; background: url(../img/header_bar02.png) no-repeat left 1px; }
.titlebox .f_right p { height: 33px; line-height: 33px;}
.titlebox .f_left .btn_gray { border-radius: 0; padding: 6px 13px; }
.titlebox .txt_btn {display: inline-block; padding: 8px 0; font-size: 12px; color: #585858; text-align: right; vertical-align: middle;}
.titlebox .txt_btn:hover { color: #0f4c81; }
.titlebox .search_range { line-height: 28px;}
.titlebox .btnlist { overflow: hidden; }
.titlebox .btnlist li { padding-left: 3px; float: left; }
.titlebox .btnlist li span { display: inline-block;  width: 50px; height: 28px; font-size: 12px; line-height: 28px; background: #fafafa; border: 1px solid #d1d1d1; cursor: pointer; text-align: center; }
.titlebox .btnlist li span.on,
.titlebox .btnlist li span:hover { color: #fff; background: #0f4c81; border: 1px solid #0f4c81; }
.titlebox .btnlist li.date_search strong { font-weight: normal; }
.titlebox .btnlist li.date_search input[type="text"] { padding: 0 8px; width: 90px; height: 28px; font-size: 12px; line-height: 28px; background: #fafafa; border: 1px solid #d1d1d1;}
.titlebox .btnlist li.date_search .bar { display: inline-block; margin: 0 5px; }

.resualtbox { margin-bottom:30px; border: 1px solid #ebebeb; }
.resualtbox ul {overflow: hidden; clear: both; }
.resualtbox ul li { padding: 11px 13px; width: 16.66%; float: left; border-left: 1px solid #ebebeb; position: relative; }
.resualtbox ul li:first-child { border-left: 0; }
.resualtbox ul li p { position: relative; overflow: hidden; }
.resualtbox ul li p span { font-size: 13px; color: #a2a2a2; }
.resualtbox ul li p .btngray { margin-right: 4px; cursor: pointer; }
.resualtbox ul li p .btngray:hover { color: #0f4c81; }
.resualtbox ul li p .btngray.on { color: #0f4c81; }
.resualtbox ul li p .btngray.bar { padding-left: 6px; background: url(../img/header_bar02.png) no-repeat left 1px; }
.resualtbox ul li p strong { display: inline-block; font-size: 13px; color: #585858; position: absolute; right:0; top:0; font-weight: normal; }
.resualtbox ul li p strong em { color: #a2a2a2;}
.resualtbox ul li p.number { margin-top: 18px; font-size: 24px; color: #0f4c81; text-align: right; font-weight: bold; }
.resualtbox ul li p.number span { font-size: 13px; color: #0f4c81; }
.resualtbox ul li p.number a { color: #0f4c81; }
.resualtbox ul li p.number a:hover { color: #666; }
.resualtbox ul li p.lb_txt { position: absolute; left: 13px; bottom: 15px; }
.resualtbox ul li p.lb_txt .black { color: #585858; margin-right: 6px }
.resualtbox ul li .redup { font-size: 13px; color: #ff4e00; padding-left: 12px; background: url(../img/redup_arrow.png) no-repeat left center; }
.resualtbox ul li .bluedown {font-size: 13px; color: #0f4c81; padding-left: 12px; background: url(../img/bluedown_arrow.png) no-repeat left center; }
.resualtbox ul.w30 li { width: 33.33%; }

/* 게시판 */
.list_table { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12) ;}
.list_table table { width: 100%; }
.list_table table tr th { padding: 12px 0; font-size: 13px; color: #585858; font-weight: bold; text-align: center; border-bottom: 1px solid #ebebeb; border-top: 1px solid #ebebeb; background: #f5f5f5; }
.list_table table tr th:first-child { border-left: 1px solid #ebebeb; }
.list_table table tr th.last { border-right: 1px solid #ebebeb; }
.list_table table tr th.clickable { text-decoration:underline; }
.list_table table tr td { padding: 12px 4px;font-size: 13px; color: #585858; border-bottom: 1px solid #eaeaea; text-align: center; }
.list_table table tr td.mx_190 { max-width: 190px; }
.list_table table tr td.mx_300 { max-width: 300px; }
.list_table table tr td.mx_320 { max-width: 320px; }
.list_table table tr td.mx_450 { max-width: 450px; }
.list_table table tr td.mx_960 { max-width: 960px; }
.list_table table tr td.fixed_100 { width: 100px; }
.list_table table tr td.fixed_160 { width: 160px; }
.list_table table tr td.ta_left { text-align: left; line-height: 18px; padding-left: 14px; }
.list_table table tr td.photo { padding: 6px 4px; }
.list_table table tr td.photo > a > span { display: inline-block; vertical-align: middle; }
.list_table table tr td .photobox { display: inline-block; margin-right: 2px; width: 28px; height: 28px; position: relative; overflow: hidden; background: #fbfbfb; vertical-align: middle; }
.list_table table tr td .photobox .cover { display: inline-block; width: 28px; height: 28px; position: absolute; top:0; left:0; overflow: hidden; }
.list_table table tr td .photobox .cover img { width:100%; height: 100%;}
.list_table table tr td .photobox .photo { width: 28px; height: 28px; }
.list_table table tr td.blue {color: #0f4c81;}
.list_table table tr td.red {color: #ff4e00;}
.list_table table tr td.btnbox {padding: 5px 4px; }
.list_table table tr td .blue_btn { display: inline-block; width: 46px; height: 30px; font-size: 12px; line-height: 30px; color: #fff; background: #0f4c81; border-radius: 2px; text-align: center; cursor: pointer; }
.list_table table tr td .blue_btn.on { cursor: default; background: url(../img/complet_ico.png) no-repeat center center; }
.list_table table tr td .blue_btn:hover { opacity: 0.9; }
.list_table table tr td .white_btn { padding: 0; display: inline-block; width: 46px; height: 30px; font-size: 12px; line-height: 30px; color: #585858; background: #fafafa; border: 1px solid #e1e1e1; border-radius: 2px; text-align: center; cursor: pointer; }
.list_table table tr td .white_btn:hover { background: #0f4c81; color: #fff; border: 1px solid #0f4c81; }
.list_table table tr td .white_btn02 { display: inline-block; width: 46px; height: 30px; font-size: 12px; line-height: 30px; color: #0f4c81; background: #fafafa; border: 1px solid #e1e1e1; border-radius: 2px; text-align: center; cursor: pointer; }
.list_table table tr td .white_btn02:hover { background: #0f4c81; color: #fff; border: 1px solid #0f4c81; }
.list_table table tr td .bluedown_btn { display: inline-block; padding: 0 10px 0 24px; height: 30px; font-size: 12px; line-height: 30px; color: #fff; background: #0f4c81 url(../img/down_btnico.png) no-repeat 10px center; border: 1px solid #0f4c81; border-radius: 2px; text-align: left; cursor: pointer; }
.list_table table tr td .bluedown_btn:hover { opacity: 0.9; }
.list_table table tr td > a:hover { color: #0f4c81;}
.list_table table tr td .underline { border-bottom: 1px solid #888; }
.list_table table tr td .underline:hover { color: #0f4c81; border-bottom: 1px solid #0f4c81; }
.list_table table tr td .tag { display: inline-block; margin-right: 6px; width: 15px; height: 17px; vertical-align: middle; background: url(../img/tag_ico.png) no-repeat left top;}
.list_table table tr td.linebox { padding: 5px 4px; }
.list_table table tr td.linebox span { display: inline-block; width: 30px; height: 30px; cursor: pointer; }
.list_table table tr td.linebox span.upbtn { margin-right: 4px; background: url(../img/btn_up.png) no-repeat left top;}
.list_table table tr td.linebox span.downbtn { background: url(../img/btn_down.png) no-repeat left top;}
.list_table table tr td.linebox span:hover { opacity: 0.6;}

.list_table02 table { width: 100%; border: 1px solid #eaeaea; border-bottom: 0; }
.list_table02 table tr th,.list_table02 table tr td { text-align: left; border-bottom: 1px solid #eaeaea; }
.list_table02 table tr th { padding: 12px 18px; font-size: 13px;  font-weight: bold; border-right: 1px solid #eaeaea; background: #fafafa; }
.list_table02 table tr td { padding: 12px 20px; font-size: 12px;  }
.list_table02 table tr td.br { border-right: 1px solid #eaeaea; }
.list_table02 table tr td.sm_pd { padding: 5px 20px;  }
.list_table02 table tr td select {display: inline-block; padding: 0 6px; height: 28px; font-size: 12px; line-height: 28px; background: #fff; border: 1px solid #d5d5d5;}
.list_table02 table tr td select.w_80 { width: 80px; }
.list_table02 table tr td select.w_110 { width: 110px; }
.list_table02 table tr td select.w_130 { width: 130px; }
.list_table02 table tr td textarea { padding: 10px; width: 100%; font-size: 12px; color: #b7b7b7; line-height: 21px; border: 1px solid #d5d5d5; background: #fff; }
.list_table02 table tr td textarea.h_100 { height: 100px; }
.list_table02 table tr td textarea.h_180 { height: 180px; }
.list_table02 table tr td textarea.h_340 { height: 340px; }
.list_table02 table tr td.conbox { padding:0; }
.list_table02 table tr td.conbox p {padding: 20px; height: 340px; line-height: 20px; overflow: auto; }
.list_table02 table tr td select.bg_gray { background: #fafafa; opacity: 0.6}
.list_table02 table tr td input[type="password"],
.list_table02 table tr td input[type="text"] { width: 100%; padding: 6px; border: 1px solid #d5d5d5; background: #fff; }
.list_table02 table tr td input[type="text"].bg_gray { background: #fafafa; }
.list_table02 table tr td input[type="text"].w_240 { width: 240px; }
.list_table02 table tr td .bar { display: inline-block; margin: 0 7px 0 8px; font-size: 12px; vertical-align: middle; }
.list_table02 table tr td.radiobox { padding: 12px; }
.list_table02 table tr td.radiobox .label.mr_36 { margin-right: 36px; }
.list_table02 table tr td.radiobox .label { margin-left: 6px; }
.list_table02 table tr td .underline { color: #0f4c81; border-bottom: 1px solid #0f4c81; }
.list_table02.write table tr td { padding: 5px 12px; }
.list_table02.write table tr td.date_search input[type="text"] { width: 123px; }
.list_table02.write table tr td.file { position: relative; overflow: hidden; }
.list_table02.write table tr td .filebtn_white { display: inline-block; width: 46px; height: 29px; font-size: 12px; line-height: 29px; background: #fafafa; border: 1px solid #e1e1e1; border-radius: 2px; text-align: center; cursor: pointer; }
.list_table02.write table tr td .filebtn_white:hover { background: #fff; }
.list_table02.write table tr td .graybox { margin: 6px 0; height: 300px;  font-size: 12px; color: #b7b7b7; line-height: 21px; border: 1px solid #d5d5d5; }


/* 페이징 */
.paging { text-align: center; }
.paging * { vertical-align: middle; }
.paging a { display: inline-block; margin: 0 3px; width: 32px; height: 32px; font-size: 12px; line-height: 32px; }
.paging a.on { color: #fff; background: #595959; border-radius: 30px; }
.paging span { display: inline-block; margin: 0 18px; }
.paging span.img { padding-top: 8px; margin: 0; }
.paging span a { width: 24px; }
.paging button { display: inline-block; margin: 0 3px; width: 32px; height: 32px; font-size: 12px; line-height: 32px; padding: 0; border: none; background: none; }
.paging button.on { color: #fff; background: #595959; border-radius: 30px; padding: 0; border: none; }
.paging span { display: inline-block; margin: 0 18px; }
.paging span.img { padding-top: 8px; margin: 0; }
.paging span botton { width: 24px; }

.table_btnarea { float: right; }
.table_btnarea .blue_btn { display: inline-block; margin-top: 3px; width: 80px; height: 30px; line-height: 30px; font-size: 14px; color: #fff; border-radius: 2px; background: #0f4c81; text-align: center; }
.table_btnarea .blue_btn:hover { opacity: 0.9; }
.table_btnarea .black_btn { display: inline-block; margin-top: 3px; padding: 0 20px; height: 30px; line-height: 30px; font-size: 14px; color: #fff; border-radius: 2px; background: #595959; text-align: center; }
.table_btnarea .black_btn:hover { opacity: 0.9; }
.table_btnarea .blue_btn.wauto { width: auto; padding: 0 20px; }
.table_btnarea .bluedown_btn { display: inline-block; padding: 0 15px 0 32px; height: 30px; font-size: 12px; line-height: 30px; color: #fff; background: #0f4c81 url(../img/down_btnico.png) no-repeat 15px center; border: 1px solid #0f4c81; border-radius: 2px; text-align: left; cursor: pointer; }
.table_btnarea .bluedown_btn:hover { opacity: 0.9; }

/*버튼영역*/
.btn_area { text-align: center; }
.btn_area a{ display: inline-block; padding: 6px 25px; font-size: 14px; border-radius: 2px; }
.btn_area .blue_btn { color: #fff; background: #0f4c81; border: 1px solid #0f4c81; }
.btn_area .blue_btn:hover { opacity: 0.9; }
.btn_area .white_btn { background: #fafafa; border: 1px solid #e1e1e1; }
.btn_area .white_btn:hover { background: #fff; }


/* 약관 */
.cm_header { padding: 32px 0; background: #fff; }
.cm_header h3 { font-size: 20px; color: #000; }
.onlytxt { margin-bottom: 100px; font-size: 13px; color: #818181; line-height: 24px; }

/* 도움말 */
.cm_header.pdc { padding: 27px 0 25px;}
.cm_header .accountbox { margin-bottom: 21px; position: relative; overflow: hidden; }
.cm_header .accountbox h3 { float: left; font-size: 24px; line-height: 36px; color: #000;}
.cm_header .accountbox .scbox { padding: 0 35px 0 18px; max-width: 190px; height: 36px; border: 1px solid #1178ed; border-radius: 30px; float: right; position: relative; overflow: hidden;}
.cm_header .accountbox .scbox input { width: 100%; height: 36px; font-size: 14px; color: #878787; border: 0; }
.cm_header .accountbox .scbox span { display: inline-block; width:19px; height: 18px; background: url(../img/svg/search_blue_ico02.svg) no-repeat left top; position: absolute; top: 8px; right:10px; cursor: pointer; }

.cm_header .tabmenu { margin: 0; overflow: hidden; }
.cm_header .tabmenu li { padding-left: 8px; margin-left: 8px; height: 14px; line-height: 14px; border-left: 1px solid #dbdbdb; float: left; }
.cm_header .tabmenu li:first-child { padding:0; margin:0; border: 0; }
.cm_header .tabmenu li span { display: inline-block; font-size: 14px; line-height: 14px; color: #585858; cursor: pointer; }
.cm_header .tabmenu li.on span,
.cm_header .tabmenu li span:hover { color: #0f4c81; }

/* 공지사항 */
.cm_header.nm { padding: 32px 0 16px; }
.noticelistbox { padding-bottom: 60px; }
.noticelistbox ul { border-top: 1px solid #eaeaea;}
.noticelistbox ul li { background: url(../img/notice_arrow.png) no-repeat right 40px; }
.noticelistbox ul li dl dt { padding: 30px 0; cursor: pointer; border-bottom: 1px solid #eaeaea;}
.noticelistbox ul li dl dt h4 { margin-bottom: 10px; font-size: 18px; color: #101010; line-height: 130%; vertical-align: middle; }
.noticelistbox ul li dl dt h4.new span { display: inline-block; margin-right: 8px; width: 16px; height: 16px; background: url(../img/new_ico.png) no-repeat left top;vertical-align: middle; }
.noticelistbox ul li dl dt p { font-size: 10px; color: #878787; }
.noticelistbox ul li dl dd { height: 0; opacity:0; overflow: hidden; border-bottom: 1px solid #eaeaea; }
.noticelistbox ul li dl dd p { margin: 10px 0 10px; font-size: 13px; color: #818181; line-height: 24px; }
.noticelistbox ul li.on { background: url(../img/notice_arrow_on.png) no-repeat right 40px; }
.noticelistbox ul li.on dt h4 { color: #0f4c81; }
.noticelistbox ul li.on dl dd { height: 100%; opacity:1;  }
.noticelistbox ul li dl dd,.noticelistbox ul li.on dl dd {
-moz-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
-ms-transition: all .2s ease-out;
transition: all .2s ease-out;
}


/* 문의 */
.inquirybox { overflow: hidden;}
.inquirybox .leftbox { width: 49%; margin-right: 1%; float: left; }
.inquirybox .rightbox { width: 49%; margin-left: 1%; float: right;}
.inquirybox .inputbox ul { margin-bottom: 0; }
.inquirybox ul li.textareabox { height: 188px; }
.inquirybox ul li textarea { height: 100%; }
.inquirybox ul li.ad_file { padding: 0 90px 0 70px; position: relative; overflow: hidden; }
.inquirybox ul li.ad_file span { display: inline-block; position: absolute; top: 16px; }
.inquirybox ul li.ad_file span.tit {padding-left: 15px; left:0; }
.inquirybox ul li.ad_file a.btn { margin-right: 10px; width:80px; height: 30px; line-height: 30px; text-align:center; font-size: 14px; color: #101010; background: #fafafa; border: 1px solid #e4e4e4; border-radius: 2px; top: 8px; right:0; z-index:1; position: absolute; cursor: default;}
.inquirybox ul li.ad_file a.btn:hover { color: #007ae5; border:1 px solid #007ae5; background: #fff; }
.inquirybox ul li.ad_file input[type="file"] { alpha(opacity=0); opacity: 0; width: 80px; height: 30px; line-height: 30px; font-size: 14px; color: #585858; border:0; background: #999; position: absolute; right:0; top:0; z-index:0; cursor: default;}
.inquirybox .agreeline { width: 100%; padding: 30px 0; position: relative; overflow: hidden; border-bottom: 1px solid #e4e4e4; }
.inquirybox .agreeline strong { margin-right: 18px; font-size: 14px; color: #101010; }
.inquirybox .agreeline a { display: inline-block; width:50px; height: 30px; line-height: 30px; text-align:center; font-size: 14px; color: #101010; background: #fafafa; border: 1px solid #e4e4e4; border-radius: 2px; }
.inquirybox .agreeline a:hover { color: #007ae5; border:1 px solid #007ae5; background: #fff; }
.inquirybox .agreeline p { padding: 30px 0; position: absolute; right: 0; top:0; }
.inquirybox .agreeline p input { margin-right: 6px; vertical-align: middle; }
.inquirybox .agreeline p label { line-height: 30px; vertical-align: middle;}
.inquirybox .helfbtnarea { padding: 30px 0 70px; }

@media all and (min-width: 0px) and (max-width: 799px){
	.cm_header { padding: 32px 20px; }
	.cm_header.pdc { padding: 27px 20px 25px;}
	.cm_header.nm { padding: 32px 20px 16px; }
	.noticelistbox ul li { background-position: 99% 40px; }
	.noticelistbox ul li dl dt { padding-left: 20px;}
	.noticelistbox ul li dl dd p { margin: 20px 20px 30px;}
	.inquirybox { padding: 0 20px; }
}
@media all and (min-width: 0px) and (max-width: 599px){
	.cm_header { padding: 32px 13px; }
	.cm_header.pdc { padding: 27px 13px 25px;}
	.cm_header.nm { padding: 32px 13px 16px; }
	.cm_header .accountbox { text-align:center; }
	.cm_header .accountbox h3 { margin-bottom: 20px; float: none; }
	.cm_header .accountbox .scbox { margin: 0 auto; max-width: 100%; width: 100%; float: none; }
	.cm_header .accbtnbox {text-align:center;}
	.cm_header .accbtnbox ul { display: inline-block; }
	.noticelistbox { padding-bottom: 0px; }
	.noticelistbox ul li dl dt { padding: 30px 30px 30px 13px; }
	.noticelistbox ul li dl dd p { margin: 20px 13px 30px;}
	.inquirybox { padding: 0 13px; }
	.inquirybox .leftbox,.inquirybox .rightbox { width: 100%; margin: 0; float: none; }
	.inquirybox .inputbox.leftbox ul { border-bottom:0; }
	.inquirybox .agreeline strong { margin-right: 8px;}
}

/* popup */
.pop { display: none; width: 100%; height: 100%; position: fixed; left:0; top:0; overflow: hidden; z-index:20; }
.pop .black_box { width: 100%; height: 100%; position: fixed; top:0; left:0; background: #000; opacity: 0.6; overflow:hidden; }
.popup { position: absolute; left: 50%; top: 50%; background: #fff;}
.popup.w_300 { width: 300px; }
.popup.w_320 { width: 320px; }
.popup.w_350 { width: 350px; }
.popup.w_410 { width: 410px; }
.popup.w_430 { width: 430px; }
.popup.w_460 { width: 460px; }
.popup.w_530 { width: 530px; }
.popup.w_550 { width: 550px; }
.popup.w_640 { width: 640px; }
.popup.w_690 { width: 690px; }
.popup.w_960 { width: 960px; }
.popup.w_1040 { width: 1040px; }
.popup .close_pop { width: 25px; height: 25px; background: url(../img/close_pop_btn.png) no-repeat left top; position: absolute; right: 13px; top:13px; }
.popheader { padding: 20px 30px 10px; position: relative; clear: both; }
.popheader h1 { font-size: 17.77px; color: #000; }
.popbody { padding: 0 20px 20px;  clear: both; }

/* Slideshow container */
.slideshow-container{max-width:1000px;position:relative;margin:auto;}
.mySlides{display:none;}
.prev, .next{cursor:pointer;position:absolute;top:50%;width:auto;margin-top:-12px;padding:12px;color:white;font-weight:bold;font-size:18px;transition:0.6s ease;border-radius:0 3px 3px 0;}
.prev{left:20px;}
.next{right:20px;}
.prev:hover, .next:hover{}
.text{color:#f2f2f2;font-size:15px;padding:8px 12px;position:absolute;bottom:8px;width:100%;text-align:center;}
.numbertext{color:#f2f2f2;font-size:12px;padding:8px 12px;position:absolute;top:0;}
.dot{cursor:pointer;height:13px;width:13px;margin:0 2px;background-color:#bbb;border-radius:50%;display:inline-block;transition:background-color 0.6s ease;}
.active, .dot:hover{background-color:#717171;}
.fade{}
@-webkit-keyframes fade{from{opacity:.4}to{opacity:1}}
@keyframes fade{from{opacity:.4}to{opacity:1}}
@media all and (min-width:768px) and (max-width:1024px){}
@media all and (min-width:768px){}
@media all and (min-width:0px) and (max-width:690px){.prev{left:5px;}.next{right:5px;}}


/* 링크 그룹 - 파란색 */
.link_group { background: #0f4c81; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);}
.link_box {height: 200px; /*  margin-left: -245px; margin-top: -176px; padding: 46px 50px; width: 490px; position: absolute; overflow: hidden; top: 50%; left: 50%; */   /* border: 1px solid #eaeaea; */ color: #fff; }
.link_box .link_header { overflow: hidden; }
.link_box .link_header h1 { height: 31px; float: left; }
.link_box .link_header h1 span { display: inline-block; padding-top: 8px; padding-left: 12px; font-size: 14px; vertical-align: top;}
.link_box .link_header p { padding-top: 8px; float: right; font-size: 17px; }
.link_box .link_header p input { margin-right: 8px; vertical-align: middle;}
.link_box .link_header p label { vertical-align: middle; font-size: 14px; }
.link_box .link_body { padding-top: 0px; padding-bottom: 0px; text-align: center; }
.link_box .link_body h1 { font-size: 20px; vertical-align: top; padding-bottom: 10px; }
.link_box .link_body p { padding-top: 0px; padding-bottom: 10px; }
.link_box .link_footer { text-align: center; padding: 5px 0px; }
.link_box .link_footer_step4 { text-align: center; padding: 0px 0px; }
.link_box fieldset { clear: both; width: 100%; vertical-align: middle; position: relative; overflow: hidden; }
.link_box fieldset input[type="text"],
.link_box fieldset input[type="password"] { padding: 0px 14px; width: 90%; height: 46px; border: 1px solid #e4e4e4; border-top:0; }
.link_box fieldset input[type="text"] { border-top: 1px solid #e4e4e4; }
.link_box fieldset a:hover { opacity: 0.9;}
.link_box a { color: white; display:inline; border-bottom:1px solid white; padding-bottom:1px }

.link_footer .home span { color: black; }
.link_footer_step4 .home span { color: black; }

.link_step1 .link_body h1 {font-weight: lighter; text-align: left; margin-top: 25px;  margin-left: 50px;}
.link_step2 .link_body { margin-top: 30px; margin-bottom: 0px; }
.link_step2 .btnlist1 {overflow: hidden; text-align: center; color: black;}
.link_step2 .btnlist1 { padding: 10px 0; overflow: hidden;}
.link_step2 .btnlist1 li { display: inline-block;   }
.link_step2 .btnlist1 li span { display: inline-block; width: 100px; font-size: 12px; line-height: 28px; background: #fafafa; border: 1px solid #d1d1d1; cursor: pointer; text-align: center;}
.link_step2 .btnlist1 li span:hover { color: #fff; background: #0f4c81; border: 1px solid #0f4c81; }
.link_step4 .btnlist1 {overflow: hidden; text-align: center; color: black;}
.link_step4 .btnlist1 { padding: 10px 0; overflow: hidden;}
.link_step4 .btnlist1 li { display: inline-block;   }
.link_step4 .btnlist1 li span { display: inline-block; width: 100px; font-size: 12px; line-height: 28px; background: #fafafa; border: 1px solid #d1d1d1; cursor: pointer; text-align: center;}
.link_step4 .btnlist1 li span:hover { color: #fff; background: #0f4c81; border: 1px solid #0f4c81; }

/* 링크 랭킹 */
.link_rank .titlebox h2 span:first-child { margin-left: 10px; color: red; }
.link_rank .titlebox h2 span { color: blue; font-weight: normal;  margin-left: 5px; }
.link_rank .titlebox .btnlist { overflow: hidden; }
.link_rank .titlebox .btnlist li { padding-left: 3px; float: left; }
.link_rank .titlebox .btnlist li span { display: inline-block; width: 85px; font-size: 12px; line-height: 28px; background: #fafafa; border: 1px solid #d1d1d1; cursor: pointer; text-align: center; }
.link_rank .titlebox .btnlist li span.on,
.link_rank .titlebox .btnlist li span:hover { color: #fff; background: #0f4c81; border: 1px solid #0f4c81; }

@media all and (min-width:768px) and (max-width:1024px) {
}

@media all and (min-width:768px) {
}

@media all and (min-width: 0px) and (max-width: 690px){
	.link_box fieldset input[type="text"] { padding: 0px 14px; width: 80%; height: 46px; border: 1px solid #e4e4e4; border-top:0; }
	.link_rank .titlebox .f_left { float: none; }
	.link_rank .titlebox .f_right { float: none; }
	.link_rank .list_table colgroup col:nth-child(2) { width: 80px; }
}

/* 링크 추천 */
.link_recommend .btn_recommend { display: inline-block; padding: 8px 13px; font-size: 12px; color: #585858; border: 1px solid #e1e1e1; border-radius: 2px; background: #fafafa; text-align: center; vertical-align: middle;border-radius: 0; padding: 6px 13px; width: 80px; }
.link_recommend .btn_recommend.on,
.link_recommend .btn_recommend:hover { background: #0f4c81; color: #fff; border: 1px solid #0f4c81; }
.link_recommend a { color: black; display: inline; text-decoration:underline; border-bottom: 1px solid black; padding-bottom: 1px; }

/* 링크 팝업 */
.tip_pop .popheader h2  {padding: 20px; text-align: center; }
.tip_pop .popbody { margin: 0 10px 10px 10px; text-align: left }
.tip_pop .popbody p { padding-top: 8px; }
.tip_pop .popbody p span { font-weight: bold; }


/* 레벨 정보 */
.my_page .titlebox { text-align: center; }
/*.my_page .list_table table tr:nth-last-child(2) td { border-bottom: 0px; }*/
.my_page .list_table table tr.no_bottom td { border-bottom: 0px; }
.my_page .list_table tr td { vertical-align: middle; }
.my_page a { color: #0f4c81; display:inline; border-bottom:1px solid white; padding-bottom:1px }
.my_page .btn_upgrade { padding: 0; display: inline-block; width: 100px; height: 30px; font-size: 12px; line-height: 30px; color: #585858; background: #fafafa; border: 1px solid #e1e1e1; border-radius: 2px; text-align: center; cursor: pointer; }
.my_page .btn_downgrade { padding: 0; display: inline-block; width: 100px; height: 30px; font-size: 12px; line-height: 30px; color: #585858; background: #fafafa; border: 1px solid #e1e1e1; border-radius: 2px; text-align: center; cursor: pointer; }

/* 도메인 관리 */
.my_domain .btnbox { }
.my_domain .btnlist { overflow: hidden; }
.my_domain .btnlist li { padding-left: 3px; float: left; }
.my_domain .btnlist li span { width: 45px; display: inline-block; padding: 0px 2px; font-size: 12px; line-height: 28px; background: #fafafa; border: 1px solid #d1d1d1; cursor: pointer; text-align: center; }
.my_domain .btnlist li span.on,
.my_domain .btnlist li span:hover { color: #fff; background: #0f4c81; border: 1px solid #0f4c81; }
.my_domain .domain_apply { }
.my_domain .domain_release { }
.my_domain .domain_raw { }
.my_domain .domain_open { }


.link_rank_create_today { cursor: pointer; }
.link_rank_popular_today { cursor: pointer; }
.link_rank_popular_week { cursor: pointer; }
.link_rank_popular_all { cursor: pointer; }



.sign_box {  font-size: 14px; color: #585858; text-align: center;  background: #fff;  border: 1px solid #eaeaea;
/* 	position: relative; */
	overflow: hidden;  max-width: 500px;
	margin: 30px auto;

	padding: 30px 50px;
/* 	margin-left: -250px; margin-top: -250px; */
/* 	padding: 46px 50px; top: 50%; left: 50%;  */
   }

.signin_box {}
.sign_box .sign_header { overflow: hidden;  }
.sign_box .sign_header h1 { height: 31px; }
.sign_box .sign_body {/*  padding-top: 30px; */ }
.sign_box .sign_body h4 { color: #666; font-weight: normal; text-align: center; margin: 30px 0 20px; }
.sign_box .sign_body .social { display: block;
  margin: 0 auto;
  overflow: hidden;
  width: 100%;}
.sign_box .sign_body .social ul { display: block; }
.sign_box .sign_body .social ul li { list-style: none; float: left; width:100%; margin: 0 0.7%; }
.sign_box .sign_body .social ul li button { display: inline-block; font-size: 14px; text-decoration: none; color: #fff; padding: 15px 5px; width: 100%; border: none; cursor: pointer;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;}
.sign_box .sign_body .social ul li button:hover { opacity: .8; }
.sign_box .sign_body .social ul li button.facebook { background: #3a589a; }
.sign_box .sign_body .social ul li button.naver { background: #5AC351; }
.sign_box .sign_body .social ul li button.google { background: #e9544f; }
.sign_box .sign_body .social ul li button.kakao { background: #FADE4B; }
/* .sign_box .sign_body .input_field label { display: block; height: 46px; color: #d6d6d6; line-height: 46px; cursor: text; position: absolute; overflow: hidden; } */
.sign_box .sign_body .input_field label.use_id { left: 14px; top: 0; }
.sign_box .sign_body .input_field label.use_pw { left: 14px; top: 46px; }
.sign_box .sign_body .input_field input[type="text"],
.sign_box .sign_body .input_field input[type="number"],
.sign_box .sign_body .input_field input[type="email"],
.sign_box .sign_body .input_field input[type="password"] { padding: 0 14px; width: 100%; height: 46px;  border: 1px solid #e4e4e4;/*  border-top:0; */ }
/* .sign_box .sign_body .input_field input[type="email"] { border-top: 1px solid #e4e4e4; } */
.sign_box .sign_body .input_field p { margin: 14 0 30px; }
.sign_box .sign_body .input_field button { display: inline-block; background-color: #0f4c81; color: #fff; font-size: 15px; text-align: center; width: 100%; padding: 11px; margin: 20px 0; cursor: pointer; border: none; border-radius: 4px; }
.sign_box .sign_body .gender_switch {
	width: 100%; height: 46px; /*  background: #6db244;  */color: white; padding: 0 10px;
}


.sign_box .sign_agree_desc { font-size: 11px; margin-top: 30px; }

/*
.gender_label {
	float: left;
	width: 50%;
	line-height: 35px;
	cursor: pointer;
	margin-top: 5px;
}

.gender_input {
	display: none;
}


.gender_input:checked + label{
	background: #0f4c81;
}
*/


.sign_box .sign_body .input_field .pass_forgot { margin-top: 20px;}
.sign_box .sign_footer {  font-size: 12px; text-align: center;  }
.sign_box .sign_body .input_field a { text-decoration: underline; }


.divider{
  background: #ddd;
  height: 1px;
  display: block;
  position: relative;
  width: 100%;
  margin: 30px auto;
}
.divider span{
  width: 30px;
  height: 20px;
  background: #fff;
  position: absolute;
  left: 50%;
  margin-left: -10px;
  top: -12px;
  text-align: center;
  color: #999;
}


@media (max-width: 480px){
  .sign_box {
/*
    width: 90%;
    margin: 30px auto;
*/
  }
}

/* 인증완료 및 비밀번호재설정 */
.agreepage { background: #f5f5f5; }
.agreepage .popup { margin-left: -160px;}
.agreepage .h_440 { margin-top: -220px; }
.agreepage .h_567 { margin-top: -284px; }

/*=================================================================================================================================================================================================================
* popup
=================================================================================================================================================================================================================*/
.pop { display: none; width: 100%; height: 100%; position: fixed; left:0; top:0; overflow: hidden; z-index:20; }
.pop .black_box { width: 100%; height: 100%; position: fixed; top:0; left:0; background: #000; opacity: 0.6; overflow:hidden; }
.popup { position: absolute; left: 50%; top: 50%; background: #fff; text-align: center; }
.popup.w_320 { width: 320px;}
.popup.w_410 { width: 410px;}
.popup.w_530 { width: 530px;}
/* .popup .close_pop { width: 25px; height: 25px; background: url(../img/close_pop_btn.png) no-repeat left top; position: absolute; right: -45px; top:21px; } */
.logp .popheader { padding: 48px 0 42px; }
.logp .popheader h1 { text-align: center;  }
.logp .popheader h1 a { display: inline-block; width: 100px; height: 60px; background: url(../img/logo.png) no-repeat left top; background-size: 100% auto; }
.logp .popbody { margin: 0 auto; padding-bottom: 48px; max-width: 238px; position: relative; overflow: hidden; }
.logp .popbody h3 { font-size: 18px; color: #323232; line-height: 100%; }

.mobpop .popup { width: 100%; height: 100%; position: relative; left:0; top:0; overflow: auto; }
.mobpop .popup.w_320 { width: 100%; }
.mobpop .popup.w_530 { width: 100%;}
.mobpop .popup .close_pop  { width: 17px; height: 17px; top: 15px; right: 15px; background: url(../img/close_mobpop_btn.png) no-repeat center center;}

/* 이메일 로그인 */
.inputbox ul { margin-bottom: 15px; border: 1px solid #e4e4e4; border-top:0; }
.inputbox ul li { border-top: 1px solid #e4e4e4; text-align: left; }
.inputbox ul li input { padding: 2px 15px 0; width:100%; height: 46px; font-size: 14px; color: #585858; border: 0; background: #fff; }
.inputbox ul li input.blue {color: #0f4c81; }
.inputbox ul li select { padding-left: 10px ; width:100%; height: 46px; font-size: 14px; color: #585858; border: 0; background: #fff; opacity: 0.6;}
.inputbox ul li textarea { padding: 15px; width:100%; border: 0; font-size: 14px; color: #585858;  }

/*로그인*/
a.albtn { display: inline-block; padding: 12px 0; width: 100%; font-size: 14px; border-radius: 2px; text-align: center; background: #0f4c81; color: #fff; }
.albtn:hover { opacity: 0.9; }
.albtn.facebook { padding-left: 50px; text-align: left;  background: #3b579d url(../img/svg/facebook_ico.svg) no-repeat 28px center; }
.albtn.email { padding-left: 74px; text-align: left;  background: #0f4c81 url(../img/svg/mail_ico.svg) no-repeat 50px center; }



/*
:root {
    --main-bg-color: #ffffff;
    --main-txt-color: #f26264;
    --sub-txt-color: #a4a4a4;
    --font-size-19: 19px;
    --font-size-17: 17px;
    --font-size-16: 16px;
    --font-size-15: 15px;
    --font-size-13: 13px;
    ;
    --font-size-10: 10px;

}
*/
			.payment-box {
				width: 600px;
/* 				max-width: 1064px; */
				margin: 0 auto;
			}

			.payment-item .payment-header {
			}

			.payment-header h1 {
				padding: 12px 8px;
				font-weight: bold;
				line-height: 1.4;
				background: #dfe3e8;
				border: 1px solid #d8d8d8;
				font-size: 15px;
/* 				display: inline-block; */
/* 				float: left;	 */
			}

			.payment-header span {
				float: right;
				text-align: right;
				font-size: 12px;
				font-weight: normal;
				color: red;
			}

			.payment-body label {
display: block;
font-size: 0;
line-height: 40px;
padding: 0 20px 0 20px;
			}

			.payment-body label > * {
display: inline-block;
font-size: 14px;
box-sizing: border-box;
vertical-align: middle
			}

			.payment-body .product-id {
				width: 20px;
			}

.product-list {
	margin-bottom: 10px
}
/*
.product-list:last-child {
	margin-bottom: 10px
}
*/

			.product-content {
				border-bottom: 1px solid #d8d8d8
			}

			.product-content:last-child {
				border-bottom: none;
			}

			.product-title {
			}

			.product-price
			{


/*
*/
			}

/*
			.clear_fix {
				clear: both;
			}
*/

.btn_area button {
	display: inline-block;
}
.select-button {
    /* font-weight: bold; */
    font-size: 13px;
    color: #fff;
    background-color: #f26264;
    border: none;
    width: 130px;
    height: 36px;
    text-align: center;
    border-radius: 15px;
    margin: 0 auto;
    display: block;
    cursor: pointer
}

.gray-button {
    /*  font-weight: bold;  */
    font-size: 13px;
    color: #505050;
    background-color: #fff;
    border: 1px solid #ccc;
    width: 130px;
    height: 36px;
    text-align: center;
    border-radius: 15px;
    margin: 0 auto;
    display: block;
    cursor: pointer
}

.gray-button.on {
    background-color: #505050;
    color: #fff;
    border: none;
}

.default-button {
    /* font-weight: bold;  */
    font-size: 13px;
    color: #f26264;
    background-color: #fff;
    border: 1px solid #f26264;
    width: 130px;
    height: 36px;
    text-align: center;
    border-radius: 15px;
    margin: 0 auto;
    display: block;
    cursor: pointer
}

/*

.payment-agree {
	text-align: center;
margin-top: 20px;
	margin-bottom: 20px;
}

.payment-agree div {
  margin: 0 auto;
    display: inline-block;
}

.payment-agree input[type="checkbox"] + label .checkbox-round {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 1px solid #f26264;
    border-radius: 100%;
    cursor: pointer;
    margin-right: 5px;
}

.payment-agree input[type="checkbox"]:checked + label .checkbox-round {
    width: 12px;
    height: 12px;

    background-color: #f26264;
}

.payment-agree input[type="checkbox"] {
    display: none;
}

.checkbox-round {
    float: left;
}

.checkbox-text {
    line-height: 20px;

    font-size: var(--font-size-15);
    color: #f26264;
}
*/

.menu-title {
color: #727272;
float: left;
/* width: 150px; */
font-size: 16px;
padding: 10px;
}

.menu-content {
	clear: both;
color: #a4a4a4;
padding: 10px;
font-size: 12px;
}

.order-notice {
	border-top: 1px solid black;
	padding: 10px 0;
}




		.clear_fix:after {
			clear: both;
			content: ' ';
			display: block;
		}

/*
		.checkbox {
			display: inline-block;
			margin-right: 40px;
		}

		.checkbox input[type="checkbox"] {
		    display: none;
		}


		.checkbox input[type="checkbox"] + label .checkbox-round {
		    display: inline-block;
		    width: 20px;
		    height: 20px;
		    border: 1px solid #f26264;
		    border-radius: 100%;
		    cursor: pointer;
		    margin-right: 5px;
		}

		.checkbox input[type="checkbox"]:checked + label .checkbox-round {
		    background-color: #f26264;
		    width: 12px;
		    height: 12px;

		}

		.checkbox input[type="checkbox"] {
		    display: none;
		}

		.checkbox .checkbox-text {
			display: inline-block;
		    line-height: 20px;

		    font-size: 15px;
		    color: #f26264;
		}
*/

		.card_form {
		}

		.card_form .setting_row {
			margin-bottom: 30px;
		}

		.card_form .title {
			display: inline-block;
			width: 150px;
			vertical-align: middle;
			padding-left: 10px;
		}

		.card_form .title > span {
			font-weight: 600;
			color: #2d2d2d;
			font-size: 14px;
			line-height: 24px;
		}

		.card_form .content {
			display: inline-block;
		}

		.card_form input[type="text"],
		.card_form input[type="password"] {
			width: 430px;
		    height: 30px;
		    padding: 15px 10px;
		    color: #222;
		    font-size: 14px;
		    line-height: 19px;
		    border-radius: 2px;
		    border: 1px solid #ddd;
		}

		.card_form .half_width {
			width: 208px !important;
		}

		.card_form .quarter_width {
			width: 104px !important;
		}

		.card_info {
			border-top: 1px solid black;
			padding: 30px 0;
		}


		.price_strong {
			color: red;
			font-weight: bold;
		}

@media all and (min-width: 0px) and (max-width: 690px){

	.payment-box {
		width: 100%;
	}

	.card_form input[type="text"],
	.card_form input[type="password"] {
		width: auto;
	}

	.card_form .half_width {
		width: auto !important;
	}

	.card_form .quarter_width {
		width: auto !important;
	}
}



.order-agree {
	padding: 10px 0;
}

.order-agree .btn_area {
	margin: 30px 0;
}