@charset "utf-8";
#wrapper {overflow:hidden;}
/*
#header #gnbWrap > a {display:none;}
*/
.main #content {box-sizing:border-box; width:1200px;margin:40px auto 50px; background:none}
.main #content *{box-sizing:border-box; font-family:"nbg"}
.main #content .box{position:relative; padding:30px; width:300px; height:280px; border:none}
.main #content .box:before{display:block; content:""; position:absolute; bottom:25px; left:30px}
.main #content .box .titArea{margin-bottom:20px}
.main #content .box .titArea span{display:block; line-height:30px; font-size:16px; color:#666}
.main #content .box .titArea strong{display:block; line-height:30px; font-size:24px; color:#333; font-weight:normal; letter-spacing:-0.5px}
.color01 {color:#4f5563 !important;}

.main #content .box.box05 .titArea span {display: none;}

.main #content .box .titArea.v1{margin-top:30px}
.main #content .box.box01{border:1px solid #e1e1e1; border-right:0; background:#fff}
.main #content .box.box02{background:#ffe23f}
.main #content .box.box03{background:#099c85}
.main #content .box.box04{background:url("../images/bg/bg_pt.jpg") repeat 0 0}
.main #content .box.box05{background:#857777}
.main #content .box.box06{border:1px solid #e1e1e1; border-left:0; background:#fff}
.main #content .box.box07{width:290px; height:250px; background:#cdd3e3}
.main #content .box.box01,
.main #content .box.box02,
.main #content .box.box03{margin-bottom:10px}
.main #content .box.box01:before{width:102px; height:81px; background:url("../images/bg/bg_img05.png") no-repeat 0 0}
.main #content .box.box02:before{width:118px; height:90px; background:url("../images/bg/bg_img07.png") no-repeat 0 0}
.main #content .box.box03:before{width:119px; height:85px; background:url("../images/bg/bg_img64.png") no-repeat 0 0}
.main #content .box.box04:before{width:112px; height:85px; background:url("../images/bg/bg_img08.png") no-repeat 0 0}
.main #content .box.box05:before{width:124px; height:89px; background:url("../images/bg/bg_img10.png") no-repeat 0 0}
.main #content .box.box07:before{width:92px; height:70px; background:url("../images/bg/bg_img11.png") no-repeat 0 0}
.main #content .box.box03 *, 
.main #content .box.box04 *,
.main #content .box.box05 *{color:#fff !important}
.main #content .box.box06 ul{}
.main #content .box.box06 ul li{position:relative; overflow:hidden; padding:0 10px 0 38px; line-height:36px; font-size:14px; color:#666; text-overflow:ellipsis; white-space:nowrap}
.main #content .box.box06 ul li.bg{background:#f5f5f5}
.main #content .box.box06 ul li span{display:block; position:absolute; top:50%; left:10px; margin-top:-10px; border-radius:20px; width:20px;height:20px; text-align:center; line-height:23px; color:#fff; background:#958e8e;font-size:12px;}
.main #content .box p{ line-height:20px; font-size:14px; color:#666}
.main #content .box p.mTxt{display:none}
.main #content .box a.btnView{display:block; position:absolute; bottom:25px; right:30px; padding:0 16px; border-radius:2px; border:1px solid #666; line-height:33px; font-size:14px; color:#666}
.main #content .box a.btnView span{display:block; padding-right:20px; min-width:82px;  background:url("../images/bg/bg_img06.png") no-repeat right center}
.main #content .box a.btnView.v1,
.main #content .box a.btnView.v2{border-color:#fff; color:#fff;}
.main #content .box a.btnView.v3{background:#e85450; }
.main #content .box a.btnView.v1 span{background:url("../images/bg/bg_img63.png") no-repeat right center}
.main #content .box a.btnView.v2 span{ background:url("../images/bg/bg_img09.png") no-repeat right center}
.main #content > div{overflow:hidden}
.main #content > div .left{float:left}
.main #content > div .right{float:right}
.main #content > div > div{overflow:hidden}
.main #content .topCont{margin-bottom:10px}
.main #content .topCont .left{width:290px; margin-right:10px}
.main #content .topCont .left .visualBox{position:relative; padding:26px 30px; height:570px; background:url("../images/bg/bg_img01.png") no-repeat 0 0}
.main #content .topCont .left .visualBox strong{display:block; position:relative; margin-bottom:22px; padding-bottom:20px; white-space:pre-line; font-size:30px; line-height:36px; color:#fff; font-weight:normal}
.main #content .topCont .left .visualBox strong:before{display:block; content:""; position:absolute; bottom:0; left:0; width:60px; border-top:2px solid #fff}
.main #content .topCont .left .visualBox p{line-height:24px; font-size:18px; color:#fff; white-space:pre-line}
.main #content .topCont .left .visualBox .loginBox{position:absolute; bottom:25px; right:0; padding:0 30px; width:100%}
.main #content .topCont .left .visualBox .loginBox a.btnLogin{display:block; position:relative; z-index:10; margin-bottom:5px; line-height:35px; text-align:center; font-size:14px; color:#666}
.main #content .topCont .left .visualBox .loginBox a.btnLogin:before{display:block; content:""; position:absolute; top:0; left:0; width:100%; height:100%; z-index:-1; border-radius:2px; background:#fff; opacity:0.9}
.main #content .topCont .left .visualBox .loginBox .member{overflow:hidden}
.main #content .topCont .left .visualBox .loginBox .member a{float:left; padding-right:12px; margin-left:23px; line-height:22px; font-size:13px; color:#fff; background:url("../images/bg/bg_img04.png") no-repeat right 6px}
.main #content .topCont .left .visualBox .loginBox .member a:first-child{margin:0}
.main #content .topCont .left .visualBox .mCont{display:none}
.main #content .topCont .right{width:900px}
.main #content .topCont .right > ul{}
.main #content .topCont .right > ul > li{float:left;border:none;}
.main #content .botCont{} 
.main #content .botCont .left{float:left; margin-right:10px; width:890px}
.main #content .botCont .left > div{float:left}
.main #content .botCont .left .notice{margin-left:10px; width:590px; padding:20px 30px; border:1px solid #e1e1e1; height:250px; background:#fff}
.main #content .botCont .left .notice > strong{display:block; margin-bottom:5px}
.main #content .botCont .left .notice > strong a{display:inline-block; padding-right:20px; line-height:48px; font-size:24px; font-weight:normal; color:#333; background:url("../images/bg/bg_img12.png") no-repeat right 13px}
.main #content .botCont .left .notice ul{}
.main #content .botCont .left .notice ul li{position:relative; padding:0 75px 0 12px; background:url("../images/bg/bg_img13.png") no-repeat left center}
.main #content .botCont .left .notice ul li a{display:block; overflow:hidden; line-height:32px; font-size:14px; color:#666; text-overflow:ellipsis; white-space:nowrap}
.main #content .botCont .left .notice ul li a:hover{text-decoration:underline}
.main #content .botCont .left .notice ul li span{display:block; position:absolute;  top:0; right:0;  line-height:32px; font-size:12px; color:#666}
.main #content .botCont .right{width:300px} 
.main #content .botCont .right .qna{padding:20px 30px; border:1px solid #e1e1e1; width:300px; height:250px; background:#fff}
.main #content .botCont .right .qna > strong{display:block; margin-bottom:20px; padding:0  0 15px 58px; border-bottom:1px solid #e1e1e1; line-height:48px; font-size:24px; color:#333; font-weight:normal; background:url("../images/bg/bg_img15.png") no-repeat left top}
.main #content .botCont .right .qna ul{}
.main #content .botCont .right .qna ul li{line-height:32px; font-size:14px; color:#666; letter-spacing:-1px}
.main #content .botCont .left .notice ul li a strong,
.main #content .botCont .right .qna ul li strong{color:#444; font-weight:normal;    font-family: "nbgb";}


.main #footer .footerBox {padding-left: 0;}

@media (max-width: 767px) {
	.main #content {width:100%; margin:40px auto 50px; background:none}
	.main #content > div .left,
	.main #content > div .right{float:right; margin-right:0 !important; width:100% !important;}
	.main #content .box{width:33.3333%; height:280px}
	.main #content .topCont{margin-bottom:10px}
	.main #content .topCont .left .visualBox{margin-bottom:10px; padding:38px 40px; height:180px; background:url("../images/bg/bg_img01_t.png") no-repeat center center; background-size:cover}
	.main #content .topCont .left .visualBox strong{margin-bottom:20px; padding-bottom:23px; white-space:normal}
	.main #content .topCont .left .visualBox p{white-space:normal}
	.main #content .topCont .left .visualBox .loginBox{bottom:10px; right:20px; padding:0; width:auto}
	.main #content .topCont .left .visualBox .loginBox .member a{margin-left:15px}
	.main #content .topCont .left .visualBox .loginBox .member a:first-child{margin:0}
	.main #content .botCont .left{position:relative; padding-left:33.3333%; margin-right:0; margin-bottom:10px; width:100%}
	.main #content .botCont .left .box07{position:absolute; top:0; left:0; width:32.2%}
	.main #content .botCont .left .notice{margin-left:0; width:100%}
	.main #content .botCont .right{width:100%} 
	.main #content .botCont .right .qna{position:relative; padding-left:177px; width:100%; height:auto}
	.main #content .botCont .right .qna > strong{position:absolute; top:20px; left:30px; margin-bottom:0; padding:0  0 0 58px; border-bottom:0; width:147px; border-right:1px solid #e1e1e1; font-size:18px}
	.main #content .botCont .right .qna ul{overflow:hidden; margin-left:15px}
	.main #content .botCont .right .qna ul li{float:left; margin-left:10px; line-height:48px;}
}

@media (max-width: 767px) {
    #wrapper {min-width: 100% !important;}
	.main #content{padding:0 20px}
	.main #content .box{padding:30px 22px 20px 22px; height:250px}
	.main #content .box:before{bottom:20px; left:22px}
	.main #content .box a.btnView{bottom:20px; right:22px; padding:0; text-indent:-9999px}
	.main #content .box a.btnView span{padding-right:0; min-width:auto; width:35px; background-position:center center !important}
	.main #content .box01.v1 a.btnView {text-indent:0;}
	.main #content .box01.v1 a.btnView span{background: url(../images/bg/mobile/bg_imgM11.png) no-repeat 90% center !important;background-size:6px 11px !important;width:100%;text-align:left;padding-left:17px;display:block;color:#665846;}

	.main #content .box .titArea{margin-bottom:15px}
	.main #content .box .titArea span{line-height:26px; font-size:14px}
	.main #content .box .titArea strong{line-height:26px; font-size:22px}
	.main #content .box .titArea.v1{margin-top:26px}
	.main #content .box.box06 ul li{line-height:30px}
	.main #content .topCont .left .visualBox{padding:35px}
	.main #content .botCont .right .qna{padding:20px 20px 20px 120px}
	.main #content .botCont .right .qna > strong{padding-left:40px; left:20px; width:103px; font-size:14px; background-size:35px; line-height:35px}
	.main #content .botCont .right .qna ul{margin-left:5px}
	.main #content .botCont .right .qna ul li{margin-left:5px; font-size:12px; line-height:35px; letter-spacing:-1px}



}

@media (max-width: 767px) {
    .main #content .botCont .right .qna ul li strong{font-family: "nbgb";    min-width: 90px;
    display: inline-block;}

	.main #content{padding:0; margin:0}
	.main #content .box{padding:28px 20px; margin-bottom:0 !important; width:100%; min-height:200px; height:auto}
    .main #content .box.box02 {background:#099c85;}
    .main #content .box.box02 strong {color:#fff;}
    .main #content .box.box03 {display:none;}
	.main #content .box.box06,
	.main #content .box.box07{display:none}
    .main #content .box.box01 {display:block;}
    .main #content .box.box01.v1 {background:#ffe23f;}
    .main #content .box.box05 .titArea span {display: block;}



	.main #content .box:before{display:none}
	.main #content .box a.btnView{display:none}
    .main #content .box01.v1 a.btnView {display: block;width:115px;}
	.main #content .box .titArea.v1{margin-top:0}
	.main #content .box .titArea span + strong{display:none}
	.main #content .box .titArea span,
	.main #content .box .titArea strong{line-height:28px; font-size:20px;font-family:'nbgb';}
	.main #content .box p{line-height:21px; font-size:15px; opacity:0.95}
	.main #content .box.box04 p{color:#ffdddc !important;}
	.main #content .box.box05 p{color:#f3ebeb !important;}
    .main #content .box01.v1 p{color:#665846;}
    .main #content .box02 .titArea span { display:none;}
    .main #content .box02 .titArea strong {display:block !important;}

    .main #content .box02 .mTxt {color:#d8fff9;}



    

	.main #content .box p.dTxt{display:none}
	.main #content .box p.mTxt{display:block;word-break:keep-all;}
	.main #content .topCont .left .visualBox{margin:0; padding:24px 0; height:368px; text-align:center; background:url("../images/bg/bg_img24.png") no-repeat center center; background-size:cover}
	.main #content .topCont .left .visualBox strong{display:block; margin-bottom:20px; padding-bottom:25px; font-size:27px; white-space: pre-line; line-height:31px}
	.main #content .topCont .left .visualBox strong:before{left:50%; margin-left:-30px; border-top:2px solid #fff}
	.main #content .topCont .left .visualBox > p{display:inline-block; line-height:22px; font-size:16px; white-space:normal; max-width:200px;color:#dcdcdc;}
	.main #content .topCont .left .visualBox .loginBox{display:none}
	.main #content .topCont .left .visualBox .mCont{display:block; position:absolute; bottom:20px; left:0; padding-top:18px; width:100%; text-align:center}
	.main #content .topCont .left .visualBox .mCont p{display:block; margin-bottom:18px; line-height:17px; font-size:14px; color:#fff}
	.main #content .topCont .left .visualBox .mCont a.btnView{display:none;}
	.main #content .topCont .left .visualBox .mCont a.btnView:before{display:block; content:""; position:absolute; top:0; left:0; z-index:-1; width:100%; height:100%; background:#fff; opacity:0.8; border-radius:3px}
	.main #content .topCont .left .visualBox .mCont a.btnView span{display:inline-block; padding-right:22px; background:url("../images/bg/bg_img25.png") no-repeat right center; background-size:12px 12px}
	.main #content .botCont .left{padding:0; margin:0}
	.main #content .botCont .left .notice{display:none;}
	.main #content .botCont .left .notice > strong{display:block; margin-bottom:10px}
	.main #content .botCont .left .notice > strong a{padding-right:20px; line-height:25px; font-size:22px; background:url("../images/bg/bg_img12.png") no-repeat right 4px; background-size:10px auto}
	.main #content .botCont .left .notice ul li{padding:0 0 0 12px}
	.main #content .botCont .left .notice ul li a{line-height:28px; font-size:15px}
	.main #content .botCont .left .notice ul li span{display:none}
	.main #content .botCont .right .qna{padding:25px 20px; height:auto; border:none}
	.main #content .botCont .right .qna > strong{margin-bottom:10px; padding-left:0; position:static; width:100%; line-height:25px; font-size:22px; color:#333; border:none; background:none;font-family:'nbgb';}
	.main #content .botCont .right .qna ul{margin-left:0}
	.main #content .botCont .right .qna ul li{float:none; padding-left:12px; margin-left:0; font-size:15px; line-height:28px; letter-spacing:-1px; background:url("../images/bg/bg_img13.png") no-repeat left center}
    .main #footer .footerBox {padding-left: 0;}
}