@charset "utf-8";
/* CSS Document */

/* skip */
#skipnav {overflow:hidden; position:absolute; width:100%; z-index:1000;}
#skipnav a {display:block; overflow:hidden; height:1px; width:1px; margin:0 -1px -1px 0; font-size:0; line-height:0; text-align:center;}
#skipnav a:focus, #skipnav a:hover, #skipnav a:active {width:auto; height:20px; margin:0; padding:8px 0 5px; background:#20262c; font-size:12px; font-weight:700; line-height:1; color:#fff;}

.skip_info {display:block; position:absolute; overflow:hidden; width:1px; height:1px; font-size:0; line-height:0; text-indent:100%;}

#wrap {min-width:300px;position: relative;}
.pc_w {max-width:1240px; margin:0 auto;}
.rtxt {color:#b61b35;}





/* header ------------------------------- */
#wrap header {position:absolute; top:0; left:0; width:100%;}
#wrap header:after {content:''; clear:both; display:block;}
#wrap header h1 {position:relative; margin:0 auto;}
#wrap header h1 a {position:absolute; top:17px; left:0px; max-width:26%; z-index:1; display:inline-block;}
#wrap header h1 a strong {display:block; /*border-bottom:1px solid #111;*/ padding-bottom:2px;}
#wrap header h1 a span {display:block; font-size:16px; color:#454545; padding-top:0px;}
#wrap header h1 img {max-width: 190px;max-height:50px;display:block;vertical-align:top;}
#wrap header h1 .hada_logo {position:relative; top:-7px; width:90%;}
#wrap header h1 .hada_logo img {max-width:200px;max-height:57px;margin-top: 0;}
/* topmenu */
#wrap header #topmenu {overflow:hidden;}
#wrap header .mb_topmenu {position:absolute; top:17px; right:0;}
#wrap header .mb_topmenu li {float:left;}
#wrap header .mb_topmenu li a {display:table-cell; vertical-align:middle; padding:5px 25px; text-align:center; font-size:16px; color:#555; position:relative; z-index:2;}
#wrap header .mb_topmenu li a:after {content:''; background:#888; width:1px; height:11px; position:absolute; top:11px; left:0;}
#wrap header .mb_topmenu li:first-child a:after, #wrap header .mb_topmenu li:first-child + li a:after, #wrap header .mb_topmenu li a.tm03:after {display:none;}
#wrap header .mb_topmenu li a:before {content:''; display:inline-block; width:20px; height:13px; position:relative; top:1px; background:url(../DR0001IMG/common/icon_set.png?ver=20.03.06) 0 0 no-repeat; background-size:500px;}
#wrap header .mb_topmenu li a.tm01:before {background-position:0 0;}
#wrap header .mb_topmenu li a.tm01_after:before {background-position:-42px 0;}
#wrap header .mb_topmenu li a.tm02:before {background-position:-21px 0;}
#wrap header .mb_topmenu li a.tm02_after:before {background-position:-63px 0;}
#wrap header .mb_topmenu li a.tm03 {background:#ee3d5b; font-size:18px; color:#fff; border-bottom:3px solid #d53853; border-radius:50px;}
#wrap header .mb_topmenu li a.tm03:before {display:none;}
#wrap header .mb_topmenu li a.tm03 strong {position:relative; padding-right:20px;}
#wrap header .mb_topmenu li a.tm03 strong:after {content:''; display:block; position:absolute; top:50%; right:0; margin-top:-6px; width:0; height:0; border-top:6px solid transparent; border-bottom:6px solid transparent; border-left:7px solid #fff;}
#wrap header .mb_topmenu li a.tm04:before {background-position:-100px 0;}
#wrap header .mb_topmenu li a.tm05:before {background-position:-84px 0;}
#wrap header .mb_topmenu li a.tm06:before {background-position:0 0; width:0;}
#wrap header .onair_cont {margin-top:0;}
#wrap header .onair_cont > button {background:#d33d4f; border:0; border-radius:50px; padding:7px 15px; display:inline-block; outline:0; cursor:pointer; text-transform:uppercase;}
#wrap header .onair_cont > button > span {position:relative; display:inline-block; color:#fff;}

/* #wrap header > .head ul li.mb {display:none;} */
#wrap .fixed {transition:all 0.2s ease-in-out; -webkit-transition:all 0.2s ease-in-out; position:fixed; background:rgba(255,255,255,1); top:0; height:72px; z-index:20; box-shadow:0px 4px 12px rgba(0,0,0,0.1);}

.gnb_wrap {position:relative;/* top: 110px; */}
#gnb {padding-left:35%; padding-top:17px;}
#gnb > li {position:relative; float:left; width:25%;}
#gnb > li > a {display:block; height:78px; line-height:76px; text-align:center; color:#222; font-size:20px; transition:all .3s; -webkit-transition:all .3s; font-weight:500;}
#gnb > li > a.on, #gnb > li > a:hover, #gnb > li > a.active {color:#0c419a;}
#gnb > li > ul {display:none; position:absolute; width:100%; left:0; box-shadow:2px 2px 2px rgba(0,0,0,.2); background:rgba(255,255,255,.95); z-index:10;}
#gnb > li > ul > li > a {display:block; text-align:center; height:45px; line-height:45px; color:#2f3134; font-size:15px; transition:all .2s; -webkit-transition:all .2s; letter-spacing:-.5px;}
#gnb > li > ul > li > a:hover, #gnb > li > ul > li > a.active {background:#0c419a; color:#fff;}

/* 모바일 전체메뉴 */
.toggleMenu a {display:none; position:absolute; top:25px; right:12px; z-index:100; width:28px; height:20px; background:url(/DR0001IMG/common/fullmenu_btn.png) 0 0 no-repeat; background-size:28px; text-indent:-99999px; /* transition:all 0.3s ease; */}
.toggleMenu a.on {position:fixed; top:18px; right:83%; width:40px; height:40px; margin-top:0; background:url(/DR0001IMG/common/fullmenu_close_btn.png) 0 0 no-repeat; background-size:40px;}
nav > div {position:relative;}
nav .mb_menu_logo, nav #m_nav {display:none;}
/* 모바일GNB */
#m_nav {background:#fff;}
#m_nav > li {border-bottom:solid 1px #e5e5e5; position:relative;}
#m_nav > li > a {display:block; color:#222; font-weight:500; padding:15px 20px; font-size:15px; text-align:left !important;}
#m_nav > li.has_sub > a {background:url(/DR0001IMG/common/mgnb_menu_off.png) no-repeat right 10px center; background-size:13px;}
#m_nav > li.has_sub > a.open {background:#fff url(/DR0001IMG/common/mgnb_menu_on.png) no-repeat right 10px center; background-size:13px;}
#m_nav li ul {display:none; background:#f7f7f7; border-top:solid 1px #e5e5e5; padding:10px 0;}
#m_nav li ul li a {display:block; color:#999; font-size:15px; padding:6px 20px !important; height:auto; line-height:normal;}

/* medal info */
.medal_info {position:absolute; top:19px; right:500px; overflow:hidden; padding:0 5px; height:32px; line-height:30px;}
.medal_info .imgs {position:absolute; top:0; left:0; width:28px; height:100%; text-align:center;}
.medal_info .infos > span {display:inline-block; padding:0 10px; position:relative;}
.medal_info .infos > span i {color:#c7192e; font-weight:bold;}
.medal_info .infos > span:before {content:''; background:#bbb; width:1px; height:10px; position:absolute; top:11px; left:0;}
.medal_info .infos > span:first-child, .medal_info .infos > img + span {padding-left:0;}
.medal_info .infos > span:first-child:before, .medal_info .infos > img + span:before {display:none;}
/* .medal_info {position:absolute; top:19px; left:160px; background:#c7192e; color:#fff; border-radius:3px; overflow:hidden; padding:0 5px; padding-left:35px; height:28px; line-height:26px; text-align:right;}
.medal_info .imgs {position:absolute; top:0; left:0; background:#383838; width:28px; height:100%; text-align:center;}
.medal_info .infos > span {display:inline-block; padding:0 10px; position:relative;}
.medal_info .infos > span:before {content:''; background:#e38c97; width:1px; height:10px; position:absolute; top:8px; left:0;}
.medal_info .infos > span:first-child {padding-left:0;}
.medal_info .infos > span:first-child:before {display:none;} */

/* footer ------------------------------- */
.mgt + footer {margin-top:0;}
footer {border-top:1px solid #dcdcdc; margin-top:6%;}
footer, footer a {color:#999;}
footer > div {overflow:hidden; padding:50px 0; position:relative;}
footer h2 {float:left; width:20%;}
footer h2 img {width:100%; max-width:180px;}
footer .copyright p > span {display:inline-block; margin:2px 0; margin-right:20px;}
footer .copyright p > span strong {position:relative;}
footer .foot_menu {margin-bottom:15px;}
footer .foot_menu a {display:inline-block; position:relative; padding:0 20px; font-size:16px; color:#555;}
footer .foot_menu a:first-child {padding-left:0;}
footer .foot_menu a:first-child + a {color:#d33d4f; font-weight:500;}
footer .foot_menu a:before {content:''; position:absolute; top:50%; left:0; margin-top:-7px; background:#ececec; width:1px; height:15px;}
footer .foot_menu a:first-child:before {display:none;}
footer .familysite {position:absolute; top:50px; left:0; right:0; text-align:center;}
footer .familysite > span {display:block; margin-bottom:7px;}
footer .familysite > a {display:inline-block; background:url(../DR0001IMG/common/fmsite_arrow.png) 100% 90% no-repeat; background-size:29px; padding-right:32px;}
footer .foot_add_wrap {position:absolute; top:50px; right:12px;}
footer .foot_btn{float: left;}
footer .foot_btn a{display:block;padding: 10px 20px;background-color: #474a4c;border-radius: 10px;color: #fff;font-size: 16px;margin-right: 30px;margin-top: 13px;/* border: 2px solid #9c9c9c; */}
footer .foot_cs {font-size:16px;color:#222;padding-left:40px;float: left;position: relative;}
footer .foot_cs:before {content:''; background:url(../DR0001IMG/common/icon_set.png) 0 -23px no-repeat; background-size:500px; width:30px; height:30px; position:absolute; top:25px; left:0;}
footer .foot_cs strong {display:block; font-size:36px; line-height:1; font-family:Arial, Helvetica, sans-serif; font-weight:bold;}
footer .foot_cs strong, footer .foot_cs a {color:#d33d4f;}
footer .foot_add_wrap .onair_cont {margin-top:10px; text-align:right;}
footer .foot_add_wrap .onair_cont > button {background:#d33d4f; border:0; border-radius:50px; padding:7px 15px; display:inline-block; outline:0; cursor:pointer; text-transform:uppercase;}
footer .foot_add_wrap .onair_cont > button > span {position:relative; display:inline-block; color:#fff;}
/* footer .foot_add_wrap .onair_cont > button > span:before {content:''; background:#fff; width:5px; height:5px; border-radius:50px; position:absolute; top:50%; left:0; margin-top:-2px;} */

a.go_top {display:none; position:fixed; z-index:8; right:7px; bottom:30px; background:url(../DR0001IMG/common/icon_go_top.png) 50% 0 no-repeat; background-size:30px; width:30px; height:30px; text-indent:-99999px; opacity:0.8;}


/* q */
.home_q{width:100%;}
.home_q_wid{width:100%;position: relative;z-index: 100;max-width: 1240px;margin: 0 auto;}
.home_q_wid .home_q_w{position: fixed; right: 50px;  top: 100px;}
.home_q_wid .home_q_w a{margin-bottom:10px; display: block;}
.home_q_wid .home_q_w a img{width:100%; max-width:115px;}

/*
.home_q_wid a{position: fixed; right: 50px;  top: 100px;}
.home_q_wid a img{width:100%; max-width:115px;}
*/











@media all and (min-width:1220px) {
header h1, nav {width:1200px; margin:0 auto;}
}

@media screen and (max-width:1220px) {
#wrap header h1 {margin-left:12px;}
.pc_w {width:auto !important; padding-left:12px; padding-right:12px;}

}

@media screen and (max-width:980px) {
#wrap header {padding-bottom:0;}
#wrap header h1 {padding:18px 0; margin-left:12px;}
#wrap header h1 > a {position:relative; top:0; max-width:none;}
#wrap header h1 > a span {font-size:14px;}
#wrap header h1 img {max-width: 150px;}
#wrap header h1 .hada_logo {width:65%;}
/* topmenu */
#wrap header #topmenu {margin:10px 20px;}
#wrap header #topmenu > li {border-bottom:1px solid #ddd;}
#wrap header #topmenu li a {display:block; padding:10px 3%; font-size:15px;}
#wrap header #topmenu li a i{display:none;}
#wrap header .onair_cont {margin:10px; text-align:center;}

/* 모바일 전체메뉴 */
.toggleMenu a {display:block;}
.gnb_overlay.on {position:fixed; z-index:9; top:0; width:100%; height:100%; background:rgba(0,0,0,0.5);}
#gnb {display:none;}
nav {width:auto; float:none;}
nav > div.mb_menu_top {position:fixed; z-index:12; top:0px; right:0; margin-top:0; width:80%; height:100%; overflow:auto; background:#fff; display:block;}
nav > div.mb_menu_top > p > a {display:block; padding:20px 0; text-align:center; background:#fbfbfb; border-bottom:3px solid #333;}
nav > div.mb_menu_top > p > a img {max-width:125px;}
nav > div.mb_menu_top > p > a > strong {display:inline-block; border-bottom:1px solid #111; padding-bottom:2px;}
nav > div.mb_menu_top > p > a > span {display:block;}
nav .mb_topmenu {display:none;}
nav .mb_nav {display:block !important; margin:15px;}
nav .mb_nav > li > a {padding:12px 5px !important;}

/* medal info */
nav .medal_info {display:none;}
#top_medal {position:relative; background:#c7192e; color:#fff; overflow:hidden; padding:0 5px; padding-left:35px; padding-right:0; height:28px; line-height:26px; text-align:left;}
#top_medal .imgs {position:absolute; top:0; left:0; background:#383838; width:28px; height:100%; text-align:center;}
#top_medal .infos > span {display:inline-block; padding:0 10px; position:relative;}
#top_medal .infos > span:before {content:''; background:#e38c97; width:1px; height:10px; position:absolute; top:8px; left:0;}
#top_medal .infos > span:first-child, #top_medal .infos > img + span {padding-left:0;}
#top_medal .infos > span:first-child:before, #top_medal .infos > img + span:before {display:none;}
#top_medal .infos > img {position:relative; top:-4px;}

/* footer */
footer {margin-top:10%;}
footer > div {padding:3% 0 5%;}
footer h2, footer > div.copyright > p {float:none; width:auto; text-align:center;}
footer h2 {margin-bottom:2.5%;}
footer > div.copyright {padding-top:4%; padding-bottom:4%;}
footer > div.foot_menu {padding:2% 0;}
footer > div.foot_menu li {float:none !important; width:auto !important; text-align:left !important;}
footer .foot_menu a {font-size:14px;}
footer .foot_menu a:before {margin-top:-7px; height:13px;}
footer > div.foot_menu .add_menu {margin-top:5px;}
footer > div.foot_menu .add_menu a:first-child {margin-left:0;}
footer p > span strong {padding-right:5px;}

footer .familysite {position:relative; top:0; right:auto; left:0; margin-bottom:4%; text-align:left;}
footer .familysite img {max-width:100px;}
footer .foot_add_wrap {position:relative;top:0;right:auto;left:0;margin-bottom: 3%;overflow: hidden;}
footer .foot_add_wrap .onair_cont {text-align:left;}

footer .foot_btn a{padding: 7px 14px;font-size: 15px;margin-right: 20px;margin-top: 13px;}

footer .foot_cs {font-size:14px; padding-left:25px; text-indent:-9999px;}
footer .foot_cs:before {top:23px; width:20px; height:20px; background-position:-37px -23px;}
footer .foot_cs strong {font-size:26px; text-indent:0;}


/* q 
.home_q_wid a.q_1{right:10px;top: 80px;}
.home_q_wid a.q_2{right: 10px;top: 195px !important;}
.home_q_wid a.q_3{right:10px;top: 310px !important;}
.home_q_wid a.q_4{right:10px;top: 425px !important;}
*/
.home_q_wid .home_q_w{right:10px; top:80px;}
}



@media screen and (max-width:768px) {

/* q 
.home_q_wid a.q_1{right:5px;top:76px;}
.home_q_wid a.q_2{right:5px;top:146px !important;}
.home_q_wid a.q_3{right:5px;top:217px !important;}
.home_q_wid a.q_4{right:5px;top: 288px !important;}
*/
.home_q_wid .home_q_w{right:5px; top:80px;}
.home_q_wid .home_q_w a{max-width:70px;}
}

@media screen and (max-width:480px) {

}





/* 상단 배너 */
.top_ban{width:100%;background:url(../DR0001IMG/common/top_ban1_bg.jpg) center;position: relative;top: 0;overflow: hidden;}
.top_ban .top_ban_wid{width:100%;max-width:1200px;margin:0 auto;overflow: hidden;}
.top_ban a{display:block;}
.top_ban .top_ban1{width: 18%;margin-right: 2%;display: inline-block;float: left;background-color: #e7ecf0;}
.top_ban .top_ban1 img{width:100%; max-width:134px;}
.top_ban .top_ban2{width: 70%;display: inline-block;float: left;}
.top_ban .top_ban2 img{width:100%;max-width: 468px;}
.top_ban .top_ban3{width: 10%;display: inline-block;float: right;text-align:right;}
.top_ban .top_ban3 img{width:100%;max-width: 74px;}
.pc_on{display:block;}
.m_on{display:none;}

@media screen and (max-width:1240px) {
	.top_ban .top_ban1{padding-left:20px;}
	.top_ban .top_ban3{padding-right:20px;}
}
@media screen and (max-width:960px) {
	.top_ban .top_ban1{width:21%;}
	.top_ban .top_ban2{width:60%;}
	.top_ban .top_ban3{width:15%;}
}
@media screen and (max-width:768px) {
	.pc_on{display:none;}
	.m_on{display:block;}
	.top_ban4{}
	.top_ban4 img{width:100%; max-width:768px;}
}



