/*----------------- header.css -----------------------*/ /*--- common selector ---*/ body,div,dl,dt,dd,ul,ol,li,form,fieldset,p,button{margin:0;padding:0;} h1, h2, h3, h4, h5, h6 { margin:0; padding:0;} body,input,select,textarea{font-family:'Malgun Gothic', '맑은 고딕',dotum,'돋움',sans-serif; font-size: 12px; font-weight:normal;} /* 137.5% == 22px */ body{ -webkit-text-size-adjust:none;} hr{display:none;} img,fieldset{border:0;} img,input,select,textarea{vertical-align:middle;} ul,ol,li{list-style:none;} a:link,a:hover,a:active,a:visited {text-decoration:none; border-style: none;} strong{font-weight:bold;} input[type="text"]{-webkit-appearance:none;-webkit-border-radius:0;} input:checked[type="checkbox"]{background-color:#fff;-webkit-appearance:checkbox;} /*--- list style ---*/ ul li { margin:0px; padding:0px; list-style:none; line-height:140%; vertical-align: middle;} .ul li{ margin:0px; padding:0px; list-style:none; line-height:140%; vertical-align: middle; float:left;} .ulBlank { padding: 0 14px;} .ulBlank li{ margin:0px; padding:0px; list-style:none; line-height:140%; vertical-align: middle; float:left;} .ur li{ margin:0px; padding:0px; list-style:none; line-height:140%; vertical-align: middle; float:right;} .float { float: left;} .floatnone { float: none; vertical-align: middle; margin-bottom: 2px;} /*--- table style ---*/ th { text-align: center;} caption { display: none;} /*--- common style ---*/ .infoPartition { font-size: 11px; font-weight: normal;} /*---------------------- main ----------------------*/ .window { width: 100%; align:center; float: left;} .window .headWrap { position: relative; width: 100%; height: 50px; background: url(/core/mobile/images/mystick_gradation/bg/bg.gif) repeat; float: left;} .window .headWrap .head { position: relative; width: 100%; height: 50px; float: left;} .window .headWrap .head .logo { position: relative; width: 100%; padding-top:5px; text-align: center; float: left;} .window .headWrap .head .headSiteMap { position: absolute; width:24px; height:24px; left: 15px; top: 14px; z-index:99;} .window .headWrap .head .headLogin { position: absolute; width:24px; height:24px; right: 15px; top: 12px; z-index:99;} /*----------------- mysrick_gradation.css -------------------------*/ /*-------------------------------------------------------------- defalt --------------------------------------------------------------*/ .sideBlank { padding: 0 1px;} .sideBlank li{ margin:0px; padding:0px; list-style:none; line-height:140%; vertical-align: middle; float:left;} /*slide*/ .device { width: 100%; height: 100%; padding: 30px; margin: 15px; position: relative;} .device .arrow-left { background: url(/core/mobile/images/mystick_gradation/button/arrows1.png) no-repeat; position: absolute; left: 10%; bottom:9%; width: 17px; height: 30px; z-index:99;} .device .arrow-right {background: url(/core/mobile/images/mystick_gradation/button/arrows2.png) no-repeat; position: absolute; right: 10%; bottom: 9%; width: 17px; height: 30px; z-index:99;} .swiper-container { height: 100%; width: 100%;} .content-slide { padding: 20px; color: #fff;} .pagination { position: absolute; left: 0px; text-align: center; bottom:5%; padding-top:25px; width: 100%; height:35px; background: url(/core/mobile/images/mystick_gradation/bg/img_bg.png) center top no-repeat; z-index:98;} .swiper-pagination-switch { display: inline-block; width: 12px; height: 12px; border-radius: 12px; background: #fff; box-shadow: 0px 1px 2px #555 inset; margin: 0 4px; cursor: pointer;} .swiper-active-switch { background: #999;} /*slide 여기까지 */ .bodyWrap { position: relative; width: 100%; float: left; } .mainContainer { position: relative; width: 100%; float: left;} .menuBox { position:relative; width: 100%; float:left;} .menuBox .mainIcon { display: block; width: 100%; margin:0 auto; padding-top: 75px; text-align: center; color:#fff; text-shadow: 1px 1px 4px rgba(0,0,0,0.9);text-decoration:none; font-weight:bold;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #slideshow { position:relative; height:350px; z-index:-1; } #slideshow IMG { position:absolute; top:0; left:0; z-index:1; opacity:0.0;} #slideshow IMG.active { z-index:3; opacity:1.0;} #slideshow IMG.last-active { z-index:2;} #slideshow img { min-height: 100%; min-width: 560px;width: 100%; height: auto; position: fixed; top: 0; left: 0;} /* 메인옵션 출력 */ .conBox { position:relative; width: 100%; float:left;} .conBox .boxList1 { position:relative; float:left; width: 90%; margin:2% 5% 4% 5%; height:25px; background: url(/core/mobile/images/mystick_gradation/bg/bg.gif) repeat; } .conBox .boxList1 .txt1 {padding:5px; width:90%; color:#cfcfcf; text-shadow: 1px 1px 1px rgba(0,0,0,0.9);text-decoration:none; font-weight:none;overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .conBox .boxList1 .txt1 a{padding:5px; width:90%; color:#cfcfcf; text-shadow: 1px 1px 1px rgba(0,0,0,0.9);text-decoration:none; font-weight:none; } .conBox .boxList1 .txt1 a:hover{padding:5px; width:90%; color:#cfcfcf; text-shadow: 1px 1px 1px rgba(0,0,0,0.9);text-decoration:none; font-weight:bold;} .conBox .boxList2 { position:relative; float:left; width: 100%; margin-bottom:5%; text-align:center; } .conBox .boxList2 img {width:292px; height:45px; } .conBox .boxList3 { position: relative; width: 90%; margin:2% 5% 4% 5%; float: left; } .conBox .boxList3 .boxTitle {position: relative; width: 100%; float: left; background: #4dc7c0; /* Old browsers */background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iIzRkYzdjMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzMzYTJhOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyNjkwOWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #4dc7c0 1%, #33a2a9 50%, #26909e 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#4dc7c0), color-stop(50%,#33a2a9), color-stop(100%,#26909e)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #4dc7c0 1%,#33a2a9 50%,#26909e 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #4dc7c0 1%,#33a2a9 50%,#26909e 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #4dc7c0 1%,#33a2a9 50%,#26909e 100%); /* IE10+ */ background: linear-gradient(to bottom, #4dc7c0 1%,#33a2a9 50%,#26909e 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dc7c0', endColorstr='#26909e',GradientType=0 ); /* IE6-8 */ height:7%;-webkit-border-radius: 5px; border:1px solid #10746e;} .conBox .boxList3 .boxTitle p {margin:5px 5px 5px 10px; font-size: 14px; font-weight: bold; color: #fff; } .conBox .boxList3 .boardList { position: relative; margin-top: 7px; float: left; width: 100%; -webkit-border-radius: 5px; background-color:#FFF; opacity:0.7;filter: Alpha(Opacity=70);/*IE7 fix*/} .conBox .boxList3 .boardList .subject { position: relative; width: 100%; float: left;} .conBox .boxList3 .boardList .subject img {margin:8px 0 0 10px;} .conBox .boxList3 .boardList .subject li { width: 100%;margin-bottom: 7px;} .conBox .boxList3 .boardList .subject li a { display: block;} .conBox .boxList3 .boardList .subject .mainLink { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: bold; color:#222;padding: 8px 13px 0 13px;} .conBox .boxList3 .boardList .subject .info { overflow: hidden; text-overflow: clip; white-space: nowrap; font-size: 12px; color:#222; padding: 3px 13px 0 13px;} .conBox .boxList3 .boardList .subject .info span { font-size: 10px; color:#fff;font-weight: bold; background-color:#444; padding:2px 6px 2px 6px;-webkit-border-radius: 5px;} .conBox .boxList3 .boardList .line { width: 96%; margin-left:2%; float: left; height: 1px; border-bottom: 1px solid #d1d1d1;} .conBox .boxList3 .albumList { position: relative; margin-top: 7px; float: left; width: 94%; -webkit-border-radius: 5px; background-color:#FFF; opacity:0.7;filter: Alpha(Opacity=70);/*IE7 fix*/padding: 3%;} .conBox .boxList3 .albumList li {width: 25%; text-align: center;} .conBox .boxList3 .albumList img {width:60px; height:53px; border: 1px darkgray solid;} #containerMain { position: relative; width: 100%; float: left; } #containerMain2 { position: relative; width: 100%; background: url(/core/mobile/images/sky_green/bg/main_bg.jpg)repeat-x; float: left;} #containerWrap { position: relative; width: 100%; float: left;} #mainIcon { position: relative; width: 100%; margin-top: 15px; float: left; margin-bottom:20px; background:url(/core/mobile/images/sky_green/bg/icon_bg.png) no-repeat 50% bottom; padding-bottom:100px;} #mainIcon1 { position: relative; width: 33%; height: 78px; align: center; text-align:center; background: url(/core/mobile/images/sky_green/bg/bg_mainmenu1.png) center top no-repeat; float:left;} #menuTxtArea { position: relative; width:1024px; height: 78px; display: table-cell; vertical-align:middle; text-align:center;} #menuTxt { position:relative; width: 73px; margin: auto; text-align:center;} .mainIcon { display: block; width: 100%; margin:0 auto; padding-top: 85px; text-align: center; text-decoration:none; font-weight:bold;} #box { position: relative; width: 100%; margin-top: 15px; float: left; border: 1px #13204b solid;} #boxTitle {height:30px; padding-top:5px; position: relative; width: 100%; float: left; background:url(/core/mobile/images/sky_green/bg/list_tit_bg.png) repeat-x;} .boxTitle { font-size: 14px; font-weight: bold;} #boxList { position: relative; margin-top: 0px; float: left; width: 100%; } #boxListSubject { position: relative; width: 100%; float: left;} #boxListSubject li { width: 100%;} #boxListSubject li a { display: block;} .mainLink { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: bold;} .subjectInfo { overflow: hidden; text-overflow: clip; white-space: nowrap; font-size: 12px; font-weight: normal;} #line { width: 100%; float: left; height: 1px; border-bottom: 1px solid #c9c9c9;} #banner { position: relative; width: 100%; margin-top: 15px; margin-bottom: 0px; height: 45px; float: left; background: url(/core/mobile/images/sky_green/button/img_banner.gif) no-repeat;} #banner a { width: 100%; height: 45px; display: block;} /* menuNavigation */ #menuNavi { position: relative; width: 100%; float: left; } #menuTop {position: relative; width: 100%; height: 37px; background: url(/core/mobile/images/sky_green/navi/bg_1.gif) center top repeat-x; float: left;} #menudepth1 { position: relative; width: 100%; float: left; } #menudepth1Left { position: absolute; left: 0; top: 0; } #menudepth1Middle { position: relative; width: 100%; float: left;} #menudepth1Txt { position: relative; width: 25%; height: 20px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; float: left;} #menudepth1Txt a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth1TxtOn { position: relative; width: 25%; height: 20px; float: left;} #menudepth1TxtOnLeft { position: absolute; left: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth1_on_left.png) no-repeat;} #menudepth1TxtOnMiddle { position: relative; width: 100%; height: 20px; float: left;} #menudepth1TxtOnMiddleBg { position: relative; width: 100%; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth1_on_middle.png) top repeat-x; float: left;} #menudepth1TxtOnText { position: absolute; left: 0; top: 2px; width: 100%;} .depth1OnText { width: 100%; text-align: center; font-weight: bold; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth1TxtOnRight { position: absolute; right: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth1_on_right.png) no-repeat;} .depth1block { display: block; font-weight: bold; color: #fff;} #menudepth1Right { position: absolute; right: 0; top: 0;} #menudepth1Bottom { position: relative; width: 100%; height: 8px; float: left;} #menudepth1BottomLeft { position: absolute; left: 0; top: 0; width: 20px; height: 8px;} #menudepth1BottomMiddle { position: relative; width: 100%; float: left;} #menudepth1BottomBg { position: relative; width: 25%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth1_bottom_middle.png) repeat-x; float: left;} #menudepth1BottomBgOn { position: relative; width: 25%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth1_bottom_middle.png) repeat-x; float: left;} #menudepth1BottomBgOnColor { position: relative; width: 100%; height: 8px; background-color: #d9d9d9; float: left;} #menudepth1BottomRight { position: absolute; right: 0; top: 0; width: 20px; height: 8px;} /* 뎁스메뉴1만 활성시 시작 */ .depthOnly1OnText {width: 100%; text-align: center; font-weight: bold; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepthOnly1TxtOn { position: relative; width: 25%; height: 20px; float: left;} #menudepthOnly1TxtOnLeft { position: absolute; left: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_left.png) no-repeat;} #menudepthOnly1TxtOnMiddle { position: relative; width: 100%; height: 20px; float: left;} #menudepthOnly1TxtOnMiddle a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepthOnly1TxtOnMiddleBg {position: relative; width: 100%; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_middle.png) top repeat-x; float: left;} #menudepthOnly1TxtOnRight { position: absolute; right: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_right.png) no-repeat;} #menudepthOnly1Bottom {position: relative; width: 100%; height: 8px; float: left;} #menudepthOnly1BottomLeft { position: absolute; left: 0; top: 0; width: 20px; height: 8px;} #menudepthOnly1BottomMiddle { position: relative; width: 100%; float: left;} #menudepthOnly1BottomArea { position: relative; width: 100%; background: url(/core/mobile/images/sky_green/navi/depth3_bottom_middle.png) repeat-x; float: left;} #menudepthOnly1BottomBg { position: relative; width: 25%; height: 8px; float: left; background-color: #fff;} #menudepthOnly1BottomBgOn { position: relative; width: 25%; height: 8px; float: left; background-color: #fff;} #menudepthOnly1BottomBgOnColor { position: relative; width: 100%; height: 8px; background-color: #fff; float: left;} #menudepthOnly1BottomRight { position: absolute; right: 0; top: 0; width: 20px; height: 8px;} /* 뎁스메뉴1만 활성시 끝 */ #menudepth2 { position: relative; width: 100%; background-color: #d9d9d9; float: left;} #menudepth2Left { position: absolute; left: 0; top: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth2_bg_left.gif) left repeat-y;} #menudepth2Middle { position: relative; width: 100%; float: left;} #menudepth2Txt { position: relative; width: 33%; height: 20px; text-align: center; float: left;} #menudepth2Txt a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth2TxtOn { position: relative; width: 33%; height: 20px; float: left;} #menudepth2TxtOnLeft { position: absolute; left: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth2_on_left.png) no-repeat;} #menudepth2TxtOnMiddle { position: relative; width: 100%; height: 20px; float: left;} #menudepth2TxtOnMiddleBg { position: relative; width: 100%; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth2_on_middle.png) repeat-x; float: left;} #menudepth2TxtOnText { position: absolute; left: 0; top: 2px; width: 100%;} .depth2OnText { width: 100%; text-align: center; font-weight: bold; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth2TxtOnRight { position: absolute; right: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth2_on_right.png) no-repeat;} .depth2block { display: block; color: #66645f;} #menudepth2Right { position: absolute; right: 0; top: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth2_bg_right.gif) right repeat-y;} #menudepth2Bottom { position: relative; width: 100%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth2_bottom_middle.png) repeat-x; float: left;} #menudepth2BottomLeft { position: absolute; left: 0; top: 0; width: 20px; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth2_bg_left.gif) repeat-y;} #menudepth2BottomMiddle { position: relative; width: 100%; float: left;} #menudepth2BottomBg { position: relative; width: 33%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth2_bottom_middle.png) repeat-x; float: left;} #menudepth2BottomBgOn { position: relative; width: 33%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth2_bottom_middle.png) repeat-x; float: left;} #menudepth2BottomBgOnColor { position: relative; width: 100%; height: 8px; background-color: #efefef; float: left;} #menudepth2BottomRight { position: absolute; right: 0; top: 0; width: 20px; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth2_bg_right.gif) right repeat-y;} #menudepth3 { position: relative; width: 100%; background-color: #efefef; float: left;} #menudepth3Left { position: absolute; left: 0; top: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth3_bg_left.gif) left repeat-y;} #menudepth3Middle { position: relative; width: 100%; float: left;} #menudepth3Txt { position: relative; width: 33%; height: 20px; text-align: center; float: left;} #menudepth3Txt a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth3TxtOn { position: relative; width: 33%; height: 20px; float: left;} #menudepth3TxtOnLeft { position: absolute; left: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_left.png) no-repeat;} #menudepth3TxtOnMiddle { position: relative; width: 100%; height: 20px; float: left;} #menudepth3TxtOnMiddleBg { position: relative; width: 100%; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_middle.png) repeat-x; float: left;} #menudepth3TxtOnText { position: absolute; left: 0; top: 2px; width: 100%;} .depth3OnText { width: 100%; text-align: center; font-weight: bold; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth3TxtOnRight { position: absolute; right: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_right.png) no-repeat;} .depth3block { display: block; color: #2b5612;} #menudepth3Right { position: absolute; right: 0; top: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth3_bg_right.gif) right repeat-y;} #menudepth3Bottom { position: relative; width: 100%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth3_bottom_middle.png) repeat-x; float: left;} #menudepth3BottomLeft { position: absolute; left: 0; top: 0; width: 20px; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth3_bg_left.gif) repeat-y;} #menudepth3BottomMiddle { position: relative; width: 100%; float: left;} #menudepth3BottomBg { position: relative; width: 33%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth3_bottom_middle.png) repeat-x; float: left;} #menudepth3BottomBgOn { position: relative; width: 33%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth3_bottom_middle.png) repeat-x; float: left;} #menudepth3BottomBgOnColor { position: relative; width: 100%; height: 8px; background-color: #ffffff; float: left;} #menudepth3BottomRight { position: absolute; right: 0; top: 0; width: 20px; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth3_bg_right.gif) right repeat-y;} #contentsBgLeft { position: absolute; left: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth4_bg_left.gif) left repeat-y; float: left;} #contentsBgRight { position: absolute; right: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth4_bg_right.gif) right repeat-y; float: left;} #menudepth4Bottom { position: relative; width:100%; height: 1px; background-color:#71962a; float: left;} #containerNewWrap { position: relative; width: 100%; background-color: #fff; float: left;} #containerSubWrap { position: relative; width: 100%; background-color: #fff; float: left;} .sideBlank { padding: 0 1px;} #box2 { position: relative; width: 100%; margin-top: 15px; float: left;} #boxList2 { position: relative; float: left; width: 100%; border: 1px solid #ddd; padding:0px 0; background:url(/core/mobile/images/sky_green/bg/alim_bg.png) repeat-x;} .alim_txt {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; color:#fff; height:20px;} /*----------------- owl.carousel.css -------------------------*/ /* * Core Owl Carousel CSS File * v1.24 */ #owl-demo .item img{ display: block; width: 92%; height: auto; margin:4% 4% 0px 4%; } /* clearfix */ .owl-carousel .owl-wrapper:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} /* display none until init */ .owl-carousel{ display: none; position: relative; width: 100%; -ms-touch-action: pan-y;} .owl-carousel .owl-wrapper{ display: none; position: relative; -webkit-transform: translate3d(0px, 0px, 0px);} .owl-carousel .owl-wrapper-outer{ overflow: hidden; position: relative; width: 100%;} .owl-carousel .owl-wrapper-outer.autoHeight{ -webkit-transition: height 500ms ease-in-out; -moz-transition: height 500ms ease-in-out; -ms-transition: height 500ms ease-in-out; -o-transition: height 500ms ease-in-out; transition: height 500ms ease-in-out;} .owl-carousel .owl-item{ float: left;} .owl-controls .owl-page, .owl-controls .owl-buttons div{ cursor: pointer; } .owl-controls { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* mouse grab icon */ .grabbing { cursor:url(grabbing.png) 8 8, move; } /* fix */ .owl-carousel .owl-wrapper, .owl-carousel .owl-item{ -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0); } /* CSS3 Transitions */ .owl-origin { -webkit-perspective: 1200px; -webkit-perspective-origin-x : 50%; -webkit-perspective-origin-y : 50%;-moz-perspective : 1200px; -moz-perspective-origin-x : 50%; -moz-perspective-origin-y : 50%; perspective : 1200px;} /* fade */ .owl-fade-out { z-index: 10; -webkit-animation: fadeOut .7s both ease; -moz-animation: fadeOut .7s both ease; animation: fadeOut .7s both ease;} .owl-fade-in { -webkit-animation: fadeIn .7s both ease; -moz-animation: fadeIn .7s both ease; animation: fadeIn .7s both ease;} /* backSlide */ .owl-backSlide-out { -webkit-animation: backSlideOut 1s both ease; -moz-animation: backSlideOut 1s both ease; animation: backSlideOut 1s both ease; } .owl-backSlide-in { -webkit-animation: backSlideIn 1s both ease; -moz-animation: backSlideIn 1s both ease; animation: backSlideIn 1s both ease; } /* goDown */ .owl-goDown-out { -webkit-animation: scaleToFade .7s ease both; -moz-animation: scaleToFade .7s ease both; animation: scaleToFade .7s ease both; } .owl-goDown-in { -webkit-animation: goDown .6s ease both; -moz-animation: goDown .6s ease both; animation: goDown .6s ease both; } /* scaleUp */ .owl-fadeUp-in { -webkit-animation: scaleUpFrom .5s ease both; -moz-animation: scaleUpFrom .5s ease both; animation: scaleUpFrom .5s ease both; } .owl-fadeUp-out { -webkit-animation: scaleUpTo .5s ease both; -moz-animation: scaleUpTo .5s ease both; animation: scaleUpTo .5s ease both; } /* Keyframes */ /*empty*/ @-webkit-keyframes empty { 0% {opacity: 1} } @-moz-keyframes empty { 0% {opacity: 1} } @keyframes empty { 0% {opacity: 1} } @-webkit-keyframes fadeIn { 0% { opacity:0; } 100% { opacity:1; } } @-moz-keyframes fadeIn { 0% { opacity:0; } 100% { opacity:1; } } @keyframes fadeIn { 0% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @-moz-keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @-webkit-keyframes backSlideOut { 25% { opacity: .5; -webkit-transform: translateZ(-500px); } 75% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); } } @-moz-keyframes backSlideOut { 25% { opacity: .5; -moz-transform: translateZ(-500px); } 75% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); } } @keyframes backSlideOut { 25% { opacity: .5; transform: translateZ(-500px); } 75% { opacity: .5; transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; transform: translateZ(-500px) translateX(-200%); } } @-webkit-keyframes backSlideIn { 0%, 25% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; -webkit-transform: translateZ(-500px); } 100% { opacity: 1; -webkit-transform: translateZ(0) translateX(0); } } @-moz-keyframes backSlideIn { 0%, 25% { opacity: .5; -moz-transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; -moz-transform: translateZ(-500px); } 100% { opacity: 1; -moz-transform: translateZ(0) translateX(0); } } @keyframes backSlideIn { 0%, 25% { opacity: .5; transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; transform: translateZ(-500px); } 100% { opacity: 1; transform: translateZ(0) translateX(0); } } @-webkit-keyframes scaleToFade { to { opacity: 0; -webkit-transform: scale(.8); } } @-moz-keyframes scaleToFade { to { opacity: 0; -moz-transform: scale(.8); } } @keyframes scaleToFade { to { opacity: 0; transform: scale(.8); } } @-webkit-keyframes goDown { from { -webkit-transform: translateY(-100%); } } @-moz-keyframes goDown { from { -moz-transform: translateY(-100%); } } @keyframes goDown { from { transform: translateY(-100%); } } @-webkit-keyframes scaleUpFrom { from { opacity: 0; -webkit-transform: scale(1.5); } } @-moz-keyframes scaleUpFrom { from { opacity: 0; -moz-transform: scale(1.5); } } @keyframes scaleUpFrom { from { opacity: 0; transform: scale(1.5); } } @-webkit-keyframes scaleUpTo { to { opacity: 0; -webkit-transform: scale(1.5); } } @-moz-keyframes scaleUpTo { to { opacity: 0; -moz-transform: scale(1.5); } } @keyframes scaleUpTo { to { opacity: 0; transform: scale(1.5); } } .owl-theme .owl-controls{ background: #fff; filter: Alpha(Opacity=50);/*IE7 fix*/ opacity: 0.3;-webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; width: 86%; margin: 5%; padding:2%; text-align: center; /* background: url(/core/mobile/images/mystick_gradation/bg/img_bg.png) center center no-repeat;*/} /* Styling Next and Prev buttons */ .owl-theme .owl-controls .owl-buttons div{ zoom:0; padding:0; /*color: #6c8ea1; display:inline-block; zoom: 1; *display: inline;/*IE7 life-saver */ /*margin: 0% 17% -20px 17%; padding: 1% 3%; font-size: 13px; font-weight:bold;-webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; background: #fff; filter: Alpha(Opacity=50);/*IE7 fix*/ /*opacity: 0.5;*/} /* Clickable class fix problem with hover on touch devices */ /* Use it for non-touch hover action */ .owl-theme .owl-controls.clickable .owl-buttons div:hover{ /*filter: Alpha(Opacity=100);IE7 fix opacity: 1; text-decoration: none;*/} /* Styling Pagination*/ .owl-theme .owl-controls .owl-page{ display: inline-block; zoom: 1; padding:5px 0 5px 0;*display: inline;/*IE7 life-saver */} .owl-theme .owl-controls .owl-page span{ display: block; width: 14px; height: 14px; margin: 5px 7px; border-radius: 14px; background: #333; box-shadow: 0px 1px 2px #000 inset; margin: 0 4px; cursor: pointer;} .owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span{ filter: Alpha(Opacity=50);/*IE7 fix*/ opacity: 0.5;} /* If PaginationNumbers is true */ .owl-theme .owl-controls .owl-page span.owl-numbers{ height: auto; width: auto; color: #FFF; padding: 2px 10px; font-size: 12px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px;} /* preloading images */ .owl-item.loading{ min-height: 150px; background: url(AjaxLoader.gif) no-repeat center center} /*----------------- main.css -------------------------*/ .sideBlank { padding: 0 1px;} .sideBlank li{ margin:0px; padding:0px; list-style:none; line-height:140%; vertical-align: middle; float:left;} /*slide*/ .device { width: 100%; height: 100%; padding: 30px; margin: 15px; position: relative;} .device .arrow-left { background: url(/core/mobile/images/mystick_gradation/button/arrows1.png) no-repeat; position: absolute; left: 10%; bottom:9%; width: 17px; height: 30px; z-index:99;} .device .arrow-right {background: url(/core/mobile/images/mystick_gradation/button/arrows2.png) no-repeat; position: absolute; right: 10%; bottom: 9%; width: 17px; height: 30px; z-index:99;} .swiper-container { height: 100%; width: 100%;} .content-slide { padding: 20px; color: #fff;} .pagination { position: absolute; left: 0px; text-align: center; bottom:5%; padding-top:25px; width: 100%; height:35px; background: url(/core/mobile/images/mystick_gradation/bg/img_bg.png) center top no-repeat; z-index:98;} .swiper-pagination-switch { display: inline-block; width: 12px; height: 12px; border-radius: 12px; background: #fff; box-shadow: 0px 1px 2px #555 inset; margin: 0 4px; cursor: pointer;} .swiper-active-switch { background: #999;} /*slide 여기까지 */ .bodyWrap { position: relative; width: 100%; float: left; } .mainContainer { position: relative; width: 100%; float: left;} .menuBox { position:relative; width: 100%; float:left;} .menuBox .mainIcon { display: block; width: 100%; margin:0 auto; padding-top: 75px; text-align: center; color:#fff; text-shadow: 1px 1px 4px rgba(0,0,0,0.9);text-decoration:none; font-weight:bold;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #slideshow { position:relative; height:350px; z-index:-1; } #slideshow IMG { position:absolute; top:0; left:0; z-index:1; opacity:0.0;} #slideshow IMG.active { z-index:3; opacity:1.0;} #slideshow IMG.last-active { z-index:2;} #slideshow img { min-height: 100%; min-width: 560px;width: 100%; height: auto; position: fixed; top: 0; left: 0;} /* 메인옵션 출력 */ .conBox { position:relative; width: 100%; float:left;} .conBox .boxList1 { position:relative; float:left; width: 90%; margin:2% 5% 4% 5%; height:25px; background: url(/core/mobile/images/mystick_gradation/bg/bg.gif) repeat; } .conBox .boxList1 .txt1 {padding:5px; width:90%; color:#cfcfcf; text-shadow: 1px 1px 1px rgba(0,0,0,0.9);text-decoration:none; font-weight:none;overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .conBox .boxList1 .txt1 a{padding:5px; width:90%; color:#cfcfcf; text-shadow: 1px 1px 1px rgba(0,0,0,0.9);text-decoration:none; font-weight:none; } .conBox .boxList1 .txt1 a:hover{padding:5px; width:90%; color:#cfcfcf; text-shadow: 1px 1px 1px rgba(0,0,0,0.9);text-decoration:none; font-weight:bold;} .conBox .boxList2 { position:relative; float:left; width: 100%; margin-bottom:5%; text-align:center; } .conBox .boxList2 img {width:292px; height:45px; } .conBox .boxList3 { position: relative; width: 90%; margin:2% 5% 4% 5%; float: left; } .conBox .boxList3 .boxTitle {position: relative; width: 100%; float: left; background: #4dc7c0; /* Old browsers */background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iIzRkYzdjMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzMzYTJhOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyNjkwOWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #4dc7c0 1%, #33a2a9 50%, #26909e 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#4dc7c0), color-stop(50%,#33a2a9), color-stop(100%,#26909e)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #4dc7c0 1%,#33a2a9 50%,#26909e 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #4dc7c0 1%,#33a2a9 50%,#26909e 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #4dc7c0 1%,#33a2a9 50%,#26909e 100%); /* IE10+ */ background: linear-gradient(to bottom, #4dc7c0 1%,#33a2a9 50%,#26909e 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4dc7c0', endColorstr='#26909e',GradientType=0 ); /* IE6-8 */ height:7%;-webkit-border-radius: 5px; border:1px solid #10746e;} .conBox .boxList3 .boxTitle p {margin:5px 5px 5px 10px; font-size: 14px; font-weight: bold; color: #fff; } .conBox .boxList3 .boardList { position: relative; margin-top: 7px; float: left; width: 100%; -webkit-border-radius: 5px; background-color:#FFF; opacity:0.7;filter: Alpha(Opacity=70);/*IE7 fix*/} .conBox .boxList3 .boardList .subject { position: relative; width: 100%; float: left;} .conBox .boxList3 .boardList .subject img {margin:8px 0 0 10px;} .conBox .boxList3 .boardList .subject li { width: 100%;margin-bottom: 7px;} .conBox .boxList3 .boardList .subject li a { display: block;} .conBox .boxList3 .boardList .subject .mainLink { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: bold; color:#222;padding: 8px 13px 0 13px;} .conBox .boxList3 .boardList .subject .info { overflow: hidden; text-overflow: clip; white-space: nowrap; font-size: 12px; color:#222; padding: 3px 13px 0 13px;} .conBox .boxList3 .boardList .subject .info span { font-size: 10px; color:#fff;font-weight: bold; background-color:#444; padding:2px 6px 2px 6px;-webkit-border-radius: 5px;} .conBox .boxList3 .boardList .line { width: 96%; margin-left:2%; float: left; height: 1px; border-bottom: 1px solid #d1d1d1;} .conBox .boxList3 .albumList { position: relative; margin-top: 7px; float: left; width: 94%; -webkit-border-radius: 5px; background-color:#FFF; opacity:0.7;filter: Alpha(Opacity=70);/*IE7 fix*/padding: 3%;} .conBox .boxList3 .albumList li {width: 25%; text-align: center;} .conBox .boxList3 .albumList img {width:60px; height:53px; border: 1px darkgray solid;} #containerMain { position: relative; width: 100%; float: left; } #containerMain2 { position: relative; width: 100%; background: url(/core/mobile/images/sky_green/bg/main_bg.jpg)repeat-x; float: left;} #containerWrap { position: relative; width: 100%; float: left;} #mainIcon { position: relative; width: 100%; margin-top: 15px; float: left; margin-bottom:20px; background:url(/core/mobile/images/sky_green/bg/icon_bg.png) no-repeat 50% bottom; padding-bottom:100px;} #mainIcon1 { position: relative; width: 33%; height: 78px; align: center; text-align:center; background: url(/core/mobile/images/sky_green/bg/bg_mainmenu1.png) center top no-repeat; float:left;} #menuTxtArea { position: relative; width:1024px; height: 78px; display: table-cell; vertical-align:middle; text-align:center;} #menuTxt { position:relative; width: 73px; margin: auto; text-align:center;} .mainIcon { display: block; width: 100%; margin:0 auto; padding-top: 85px; text-align: center; text-decoration:none; font-weight:bold;} #box { position: relative; width: 100%; margin-top: 15px; float: left; border: 1px #13204b solid;} #boxTitle {height:30px; padding-top:5px; position: relative; width: 100%; float: left; background:url(/core/mobile/images/sky_green/bg/list_tit_bg.png) repeat-x;} .boxTitle { font-size: 14px; font-weight: bold;} #boxList { position: relative; margin-top: 0px; float: left; width: 100%; } #boxListSubject { position: relative; width: 100%; float: left;} #boxListSubject li { width: 100%;} #boxListSubject li a { display: block;} .mainLink { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: bold;} .subjectInfo { overflow: hidden; text-overflow: clip; white-space: nowrap; font-size: 12px; font-weight: normal;} #line { width: 100%; float: left; height: 1px; border-bottom: 1px solid #c9c9c9;} #banner { position: relative; width: 100%; margin-top: 15px; margin-bottom: 0px; height: 45px; float: left; background: url(/core/mobile/images/sky_green/button/img_banner.gif) no-repeat;} #banner a { width: 100%; height: 45px; display: block;} /* menuNavigation */ #menuNavi { position: relative; width: 100%; float: left; } #menuTop {position: relative; width: 100%; height: 37px; background: url(/core/mobile/images/sky_green/navi/bg_1.gif) center top repeat-x; float: left;} #menudepth1 { position: relative; width: 100%; float: left; } #menudepth1Left { position: absolute; left: 0; top: 0; } #menudepth1Middle { position: relative; width: 100%; float: left;} #menudepth1Txt { position: relative; width: 25%; height: 20px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; float: left;} #menudepth1Txt a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth1TxtOn { position: relative; width: 25%; height: 20px; float: left;} #menudepth1TxtOnLeft { position: absolute; left: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth1_on_left.png) no-repeat;} #menudepth1TxtOnMiddle { position: relative; width: 100%; height: 20px; float: left;} #menudepth1TxtOnMiddleBg { position: relative; width: 100%; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth1_on_middle.png) top repeat-x; float: left;} #menudepth1TxtOnText { position: absolute; left: 0; top: 2px; width: 100%;} .depth1OnText { width: 100%; text-align: center; font-weight: bold; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth1TxtOnRight { position: absolute; right: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth1_on_right.png) no-repeat;} .depth1block { display: block; font-weight: bold; color: #fff;} #menudepth1Right { position: absolute; right: 0; top: 0;} #menudepth1Bottom { position: relative; width: 100%; height: 8px; float: left;} #menudepth1BottomLeft { position: absolute; left: 0; top: 0; width: 20px; height: 8px;} #menudepth1BottomMiddle { position: relative; width: 100%; float: left;} #menudepth1BottomBg { position: relative; width: 25%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth1_bottom_middle.png) repeat-x; float: left;} #menudepth1BottomBgOn { position: relative; width: 25%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth1_bottom_middle.png) repeat-x; float: left;} #menudepth1BottomBgOnColor { position: relative; width: 100%; height: 8px; background-color: #d9d9d9; float: left;} #menudepth1BottomRight { position: absolute; right: 0; top: 0; width: 20px; height: 8px;} /* 뎁스메뉴1만 활성시 시작 */ .depthOnly1OnText {width: 100%; text-align: center; font-weight: bold; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepthOnly1TxtOn { position: relative; width: 25%; height: 20px; float: left;} #menudepthOnly1TxtOnLeft { position: absolute; left: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_left.png) no-repeat;} #menudepthOnly1TxtOnMiddle { position: relative; width: 100%; height: 20px; float: left;} #menudepthOnly1TxtOnMiddle a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepthOnly1TxtOnMiddleBg {position: relative; width: 100%; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_middle.png) top repeat-x; float: left;} #menudepthOnly1TxtOnRight { position: absolute; right: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_right.png) no-repeat;} #menudepthOnly1Bottom {position: relative; width: 100%; height: 8px; float: left;} #menudepthOnly1BottomLeft { position: absolute; left: 0; top: 0; width: 20px; height: 8px;} #menudepthOnly1BottomMiddle { position: relative; width: 100%; float: left;} #menudepthOnly1BottomArea { position: relative; width: 100%; background: url(/core/mobile/images/sky_green/navi/depth3_bottom_middle.png) repeat-x; float: left;} #menudepthOnly1BottomBg { position: relative; width: 25%; height: 8px; float: left; background-color: #fff;} #menudepthOnly1BottomBgOn { position: relative; width: 25%; height: 8px; float: left; background-color: #fff;} #menudepthOnly1BottomBgOnColor { position: relative; width: 100%; height: 8px; background-color: #fff; float: left;} #menudepthOnly1BottomRight { position: absolute; right: 0; top: 0; width: 20px; height: 8px;} /* 뎁스메뉴1만 활성시 끝 */ #menudepth2 { position: relative; width: 100%; background-color: #d9d9d9; float: left;} #menudepth2Left { position: absolute; left: 0; top: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth2_bg_left.gif) left repeat-y;} #menudepth2Middle { position: relative; width: 100%; float: left;} #menudepth2Txt { position: relative; width: 33%; height: 20px; text-align: center; float: left;} #menudepth2Txt a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth2TxtOn { position: relative; width: 33%; height: 20px; float: left;} #menudepth2TxtOnLeft { position: absolute; left: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth2_on_left.png) no-repeat;} #menudepth2TxtOnMiddle { position: relative; width: 100%; height: 20px; float: left;} #menudepth2TxtOnMiddleBg { position: relative; width: 100%; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth2_on_middle.png) repeat-x; float: left;} #menudepth2TxtOnText { position: absolute; left: 0; top: 2px; width: 100%;} .depth2OnText { width: 100%; text-align: center; font-weight: bold; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth2TxtOnRight { position: absolute; right: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth2_on_right.png) no-repeat;} .depth2block { display: block; color: #66645f;} #menudepth2Right { position: absolute; right: 0; top: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth2_bg_right.gif) right repeat-y;} #menudepth2Bottom { position: relative; width: 100%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth2_bottom_middle.png) repeat-x; float: left;} #menudepth2BottomLeft { position: absolute; left: 0; top: 0; width: 20px; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth2_bg_left.gif) repeat-y;} #menudepth2BottomMiddle { position: relative; width: 100%; float: left;} #menudepth2BottomBg { position: relative; width: 33%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth2_bottom_middle.png) repeat-x; float: left;} #menudepth2BottomBgOn { position: relative; width: 33%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth2_bottom_middle.png) repeat-x; float: left;} #menudepth2BottomBgOnColor { position: relative; width: 100%; height: 8px; background-color: #efefef; float: left;} #menudepth2BottomRight { position: absolute; right: 0; top: 0; width: 20px; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth2_bg_right.gif) right repeat-y;} #menudepth3 { position: relative; width: 100%; background-color: #efefef; float: left;} #menudepth3Left { position: absolute; left: 0; top: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth3_bg_left.gif) left repeat-y;} #menudepth3Middle { position: relative; width: 100%; float: left;} #menudepth3Txt { position: relative; width: 33%; height: 20px; text-align: center; float: left;} #menudepth3Txt a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth3TxtOn { position: relative; width: 33%; height: 20px; float: left;} #menudepth3TxtOnLeft { position: absolute; left: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_left.png) no-repeat;} #menudepth3TxtOnMiddle { position: relative; width: 100%; height: 20px; float: left;} #menudepth3TxtOnMiddleBg { position: relative; width: 100%; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_middle.png) repeat-x; float: left;} #menudepth3TxtOnText { position: absolute; left: 0; top: 2px; width: 100%;} .depth3OnText { width: 100%; text-align: center; font-weight: bold; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #menudepth3TxtOnRight { position: absolute; right: 0; top: 0; width: 8px; height: 20px; background: url(/core/mobile/images/sky_green/navi/depth3_on_right.png) no-repeat;} .depth3block { display: block; color: #2b5612;} #menudepth3Right { position: absolute; right: 0; top: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth3_bg_right.gif) right repeat-y;} #menudepth3Bottom { position: relative; width: 100%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth3_bottom_middle.png) repeat-x; float: left;} #menudepth3BottomLeft { position: absolute; left: 0; top: 0; width: 20px; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth3_bg_left.gif) repeat-y;} #menudepth3BottomMiddle { position: relative; width: 100%; float: left;} #menudepth3BottomBg { position: relative; width: 33%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth3_bottom_middle.png) repeat-x; float: left;} #menudepth3BottomBgOn { position: relative; width: 33%; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth3_bottom_middle.png) repeat-x; float: left;} #menudepth3BottomBgOnColor { position: relative; width: 100%; height: 8px; background-color: #ffffff; float: left;} #menudepth3BottomRight { position: absolute; right: 0; top: 0; width: 20px; height: 8px; background: url(/core/mobile/images/sky_green/navi/depth3_bg_right.gif) right repeat-y;} #contentsBgLeft { position: absolute; left: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth4_bg_left.gif) left repeat-y; float: left;} #contentsBgRight { position: absolute; right: 0; width: 20px; height: 100%; background: url(/core/mobile/images/sky_green/navi/depth4_bg_right.gif) right repeat-y; float: left;} #menudepth4Bottom { position: relative; width:100%; height: 1px; background-color:#71962a; float: left;} #containerNewWrap { position: relative; width: 100%; background-color: #fff; float: left;} #containerSubWrap { position: relative; width: 100%; background-color: #fff; float: left;} .sideBlank { padding: 0 1px;} #box2 { position: relative; width: 100%; margin-top: 15px; float: left;} #boxList2 { position: relative; float: left; width: 100%; border: 1px solid #ddd; padding:0px 0; background:url(/core/mobile/images/sky_green/bg/alim_bg.png) repeat-x;} .alim_txt {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; color:#fff; height:20px;} /*----------------- sub_main.css -------------------------*/ .submainSubject { padding: 0 40px 0 45px; height: 38px; } .submainSubject p { padding-top: 12px; font-size: 14px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} /*----------------- footer.css -------------------------*/ .footer { position: relative; width: 100%; height: 36px; align: center; float: left; background: url(/core/mobile/images/mystick_gradation/bg/bg_footer_1.gif) repeat;} .footer .footerBtn { position: relative; width: 320px; height: 36px; margin: auto;} .footBack { position: relative; float: left;width: 100%; min-height:55px; background: url(/core/mobile/images/mystick_gradation/bg/bg.gif) repeat; } .footBack .address { position: relative; float: left;width: 100%; .height: 15px; padding: 10px 0px 0px 0px; text-align: center; color: #999; font-size: 11px; letter-spacing: -0.5px; float: left;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .footBack .copyright { position: relative; width: 100%; height: 20px; padding-bottom: 5px; text-align: center; color: #999; font-size: 11px; letter-spacing: -0.5px; float: left;} #footer { position: relative; width: 100%; height: 68px; background: url(/core/mobile/images/sky_green/bg/foot_bg.png) repeat-x; float: left; margin-top:15px;} #footerInfor { position: absolute; width: 100%; height: 65px;} #footerInfor li { width: 100%; text-align: center; margin-top: 2px; line-height: 160%;} #footerInfor li p { font-weight: normal; font-size: 11px; color: #989898; padding-top:3px;} /*----------------- color.css -------------------------*/ /*-------------------------------------------------------------- defalt --------------------------------------------------------------*/ /* main */ body { background-color: #fff; color: #666;} /* basic font color & bgcolor */ a { color: #615e71;} #box { border-color: #a1a1a1; background-color: #fff;} /* recent box line color bgcolor */ #boxList { border-color: #cccccc; background-color: #fff;} /* recent box line color bgcolor */ #mainStyle1 { border-color: #a1a1a1; background-color: #fff;} /* recent box line color bgcolor */ #mainStyle1List { background-color: #fff;} /* recent box line color bgcolor */ #boxList2 {background:url(/core/mobile/images/sky_blue/bg/alim_bg.png) repeat-x; color:#fff; font-weight:bold;} .mainLink { color: #000;} /* main link color */ .subjectInfo { color: #8e8e8e;} /* main subject info color */ #boxTitle { color: #fff;} #banner { background-color: #273039;} /* subMain */ .titleTop { height: 46px; border-bottom: 2px solid #999999;} .title { color: #2c2c2c;} .submainSubject p { color: #000;} /* fontcolor */ /* broadcast */ .listSubjectInfo { color: #8e8e8e;} /* subject infocolor */ #containerContents { background: url(/core/mobile/images/defalt/bg/contents_1.gif) center top repeat-x; background-color: #fff;} /* backgroundimg & bgcolor */ .contentsPhotoListInfo { color: #8e8e8e;} /* list subject info color */ .paging strong { color: #555; background-color: #d5dff6; border:1px solid #999;} /* now paging box bgcolor */ .contentsPhotoSubject strong { color: #ffa200;} .contents { background-color: #fff; color: #000; border: 1px solid #ccc;} /* board */ .boardTop { border-bottom: 1px solid #aaa;} .boardTop1 { color: #080808;} .boardTop2 { color: #080808;} .contentsPhotoListSubject { color: #000;} /* reply subject color */ .contentsPhotoListSubject2 { color: #000;} /* reply subject color */ .contentsPhotoListSubjectReply { color: #666;} /* reply subject color */ .contentsPhotoListSubjectReply2 { color: #000;} /* reply subject color */ .contentsView { background-color: #fff; border: 1px solid #fff;} /* view text box color */ .contentsViewSubject { color: #dfa44b;} .viewInfo { color: #8e8e8e;} /* business */ .businessView001 { border-top: 1px solid #a1a1a1;} /* cafe */ .cafeTop, .cafeTop1, .cafeTop2 { color: #666;} .cafeTopTitle { color: #333; border-bottom: 2px solid #c1d1f5;} .cafeWrite001 { border-bottom: 1px solid #c1d1f5;} .cafeRecetList001 { border-bottom: 1px solid #a1a1a1;} .cafeRecetList002 { background-color: #d5dff6; border-bottom: 1px solid #a1a1a1;} /* schedule */ .thSunday { color: #ff0000;} .thSaturday { color: #002aff;} .tdSunday { color: #ff4200;} .tdSaturday { color: #006ac4;} .past { color: #cccccc;} .event { color: #333;} .scheduleSubject a { color: #000;} .scheduleSubjectdate { color: #ff4e00;} .scheduleTitleLine {border-bottom:1px solid #9eb1db;} /* food */ .food { width: 100%; background: url(/core/mobile/images/optimus_hotpink/common/food/food_bg.jpg);} #food { position: relative; width: 320px; background: url(/core/mobile/images/optimus_hotpink/common/food/food_middle.jpg) repeat-y; display: inline-block;} .foodTop { width: 320px; background: url(/core/mobile/images/optimus_hotpink/common/food/food_top.jpg) no-repeat;} .foodTh { color: #474747; background-color: #fbffc1; padding: 2px 4px;} .foodTh001 { color: #fbffc1; background-color: #60753c; text-align: center; padding: 2px 4px;} .foodTd001 { color: #fff; background-color: #60753c; text-align: left; padding: 2px 4px;} /* webzine */ .webzinePage { color: #6475c7;} .webzineView001 { border-bottom: 1px solid #a1a1a1;} .webzineView002 { border-top: 1px solid #a1a1a1; border-bottom: 1px solid #a1a1a1;} .webzineView003 { border-top: 1px solid #a1a1a1;} /* history */ .historyDate { color: #5e98db;} /* bible */ .searchBible a { color: #7f92be; background-color: #fff; border: 1px solid #7f92be;} .searchText a { background-color: #7f92be; border: 1px solid #7f92be;} .bibleChapter { color: #5e98db; font-weight: bold;} /* people */ .peopleView001 { border-bottom: 1px solid #a1a1a1;} .peopleView002 { border: 1px solid #fff;} .peopleView003 { color: #8e8e8e; } .peopleView004 { color: #8e8e8e;} /* photo */ .photoInfo { color: #8e8e8e;} .photoListMain001 { border-bottom: 1px solid #a1a1a1;} /* login */ .loginCheck { color: #2c2c2c;} .loginText a { color: #8e8e8e;} .login001 { border-top: 1px solid #a1a1a1; border-bottom: 1px solid #a1a1a1;} .loginLine {} .loginLine1 {} /* citms */ .searchDetail { color: #333;} .dataEdu thead tr th {color:#ffffff;}/*교육현황*/ #replyBg { background-color: #081e32;} .pagingBible { width: 100%; text-align: center;} .pagingBible a { display: inline-block; min-width: 37px; height: 21px; border: 1px solid #fff; line-height: 180%; margin: 0 5px 0 5px;} .pagingBible a.arrow { display: inline-block; min-width: 21px; height: 21px; border: 1px solid #fff; line-height: 180%; margin: 0 5px 0 5px;} .pagingBible strong { display: inline-block; width: 37px; height: 21px; border: 1px solid #fff; line-height: 180%; margin: 0 5px 0 5px;} .cho_num { background-color: #0057c1;} /*----------------- contents.css -------------------------*/ #containerWrap { position: relative; width: 100%; float: left;} .ulBlank { padding: 0 14px;} .ulBlank li{ margin:0px; padding:0px; list-style:none; line-height:140%; vertical-align: middle; float:left;} #containerContents { position: relative; width: 100%; float: left;} #containerContents #containerWrap .ulBlank li { width: 100%; float: left;} /* boradcast */ .title { width: 100%; font-size: 16px; padding-top: 9px; font-weight: bold;} .contentsPhotoList { width: 100%;} .contentsPhotoListSubject {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: bold;} .contentsPhotoListInfo { overflow: hidden; text-overflow: clip; white-space: nowrap; font-size: 12px; font-weight: normal; line-height: 120%;} .paging { width: 100%; text-align: center;} .paging a { display: inline-block; min-width: 21px; height: 21px; border: 1px solid #fff; line-height: 180%; margin: 0 5px 0 5px;} .paging strong { display: inline-block; width: 21px; height: 21px; border: 1px solid #fff; line-height: 180%; margin: 0 5px 0 5px;} .contentsPhotoSubject { overflow: hidden; font-size: 14px; font-weight: bold; line-height: 160%;} .input_file { color:#fff; } /* board */ .boardTop1 { font-size: 16px; font-weight: bold; display: inline-block; height: 25px; padding-top: 5px;} .boardTop2 { font-size: 14px; font-weight: bold; display: inline-block; height: 25px; padding-top: 5px;} .contentsPhotoListSubjectReply { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: bold;} .contentsViewSubject { font-size: 14px; font-weight: bold;} .contentsView { color: #000;} .contentsView li a { color: #666666;} #linkColor a { color: #666;} #AB_viewContent li { line-height:1.3;} .btnList { position: absolute; right: 0; bottom: 0;} .viewBtnBottom a { padding: 5px;} .viewUpDown { width: 100%; font-size: 14px;} .viewUpDown a { display: block; padding: 5px 0;} .write { position: relative; width: 100%;} .write label { position: absolute; left: 0; top: 5px; font-size: 14px; font-weight: bold; width: 80px;} .write p { padding-left: 80px;} .write p select { width: 100%; font-size: 14px; font-weight: bold;} .write p input[type="text"], .write p input[type="password"] { width: 100%; font-size: 14px; border: 1px solid #616161; -webkit-border-radius:5px; float: left;} .write .input_file {color:#000000;} /* cafe */ .cafeTop { font-weight: bold; font-size: 14px;} .cafeTop1 { font-size: 16px; font-weight: bold; display: inline-block; height: 25px; padding-top: 5px;} .cafeTop2 { font-size: 14px; font-weight: bold; display: inline-block; height: 25px; padding-top: 5px;} .btnRegister { position: absolute; right: 0;} /* schedule */ .scheduleTop a { display: inline-block;} .scheduleTop p { display: inline-block; font-size: 16px; font-weight: bold; padding-top: 4px;} #schedule { position: relative; width: 292px; display: inline-block; margin-top: 15px;} .calendarT { background-color: #fff; color: #333333; border: 1px solid #a1a1a1; border-bottom:none; font-size: 14px; font-weight: bold;} .calendarTop { width: 100%; height: 29px; background: url(/core/mobile/images/defalt/bg/calendar_top_1.gif) repeat-x;} .thSunday {width: 40px; height: 29px; border-bottom: 1px solid #a1a1a1;} .th {width: 40px; height: 29px; border-bottom: 1px solid #a1a1a1;} .thSaturday {width: 40px; height: 29px; border-bottom: 1px solid #a1a1a1;} .tdSunday { height: 40px; border-bottom: 1px solid #a1a1a1; border-right: 1px solid #a1a1a1;} .td { height: 40px; border-bottom: 1px solid #a1a1a1; border-right: 1px solid #a1a1a1;} .tdSaturday { height: 40px; border-bottom: 1px solid #a1a1a1;} .event { display: block; padding: 12px; background-color: #fecd0b;} .today { padding: 12px; background-color: #dbdbdb;} .scheduleSubject { width: 290px; border: 1px solid #a1a1a1; background-color: #fff; text-align: left; height: 25px; position: relative;} .scheduleSubject a.aSubject { display: block; padding-right: 30px; font-weight: bold; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .scheduleSubject a.aEdit { position: absolute; right: 0; top: 0; bottom: 0; display: block; font-weight: bold; font-size: 12px; line-height: 1.8; padding: 2px 5px; background-color: #f1bc49; color: #fff;} .btnScheduleList { position: absolute; right: 0; top: 3px;} .scheduleTitle { font-size: 14px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #schedule .scheduleBtnType1 { margin-top: 10px; display: inline-block; border-radius: 3px; background-color: #f1bc49; padding: 15px 20px; font-size: 18px; font-weight: 600; color: #fff;} .scheduleWrite { text-align: left; border-top: 2px solid #666;} .scheduleWrite > div { padding: 10px 5px; border-bottom: 1px solid #666;} .scheduleWrite > div > div:nth-child(1) { font-size: 15px; font-weight: 600; color: #333; padding-bottom: 10px;} .scheduleWrite > div > div:nth-child(1) > p { display: inline-block; width: 4px; height: 15px; border-radius: 3px; background-color: #666; vertical-align: middle; margin-bottom: 3px;} .scheduleWrite > div > div:nth-child(2) > p { margin-bottom: 10px; border: 1px solid #d2d2d2; border-radius: 3px; padding: 10px; background-color: #fff; line-height: 2.4;} .scheduleWrite > div > div:nth-child(2) > p > span { font-size: 13px; color: #333;} .scheduleWrite > div > div:nth-child(2) > p:last-child { margin-bottom: 0;} .scheduleWrite label { font-size: 15px; font-weight: 600;} .scheduleWrite label input[type="checkbox"] { vertical-align: middle !important; margin-bottom: 3px !important;} .scheduleWrite input[type="text"] { border: 1px solid #d2d2d2; padding: 10px; width: 100%; box-sizing: border-box;} .scheduleWrite textarea { border: 1px solid #d2d2d2; padding: 10px; width: 100%; height: 100px; box-sizing: border-box;} .scheduleWrite .bottomBtn { text-align: center; padding: 20px 0;} .scheduleWrite .bottomBtn .schwBtn1 { display: inline-block; border-radius: 3px; background-color: #f1bc49; padding: 5px 10px; font-size: 18px; font-weight: 600; color: #fff;} .scheduleWrite .bottomBtn .schwBtn2 { display: inline-block; border-radius: 3px; background-color: #f1bc49; padding: 5px 10px; font-size: 18px; font-weight: 600; color: #fff;} /* history */ .historyDate { font-size: 12px;} .historySubject { font-size: 12px;} /* bible */ #search { display: inline-block;} .searchBible a {display: inline-block; padding: 5px 25px 3px 28px; font-size: 14px; font-weight: bold;} .searchText a { display: inline-block; padding: 5px 25px 3px 28px; color: #fff; font-size: 14px; font-weight: bold;} .rangeLabel { position: absolute; left: 0; font-size: 14px; font-weight: bold; width: 80px;} .range p { margin-left: 80px;} .range p select { font-size: 14px; font-weight: bold;} .bible { font-size: 14px;} .pagingBible { width: 100%; text-align: center;} .pagingBible a { display: inline-block; min-width: 37px; height: 21px; border: 1px solid #fff; line-height: 180%; margin: 0 5px 0 5px;} .pagingBible a.arrow { display: inline-block; min-width: 21px; height: 21px; border: 1px solid #fff; line-height: 180%; margin: 0 5px 0 5px;} .pagingBible strong { display: inline-block; width: 37px; height: 21px; border: 1px solid #999; line-height: 180%; margin: 0 5px 0 5px;} .cho_num { background-color: #d5dff6;} /* photo */ #photoList { position: relative; width: 33.3%; float: left; text-align: center; margin-bottom: 25px;} #photoBox { display: inline-block; width: 95px; text-align: center;} .photo { display: table-cell; width: 95px; height: 95px; vertical-align: middle; background-color: #ddd;} .photoSubject { font-weight: bold;} .photoInfo { line-height: 120%;} /* webzine */ /* people */ .peopleView003 {width:100%; white-space:pre-line; word-break:break-all;} /* login */ .loginCheck { font-weight: bold; font-size: 14px;} .loginText a { display: block;} /* citms */ .btnSearch { position: absolute; right: 14px; bottom: 9px;} .searchDetail { position: relative; width: 100%; color: #333;} .searchDetail label { position: absolute; left: 0; top: 5px; font-size: 14px; font-weight: bold; width: 80px;} .searchDetail p { padding-left: 80px;} .searchDetail p select { width: 100%; font-size: 14px; font-weight: bold;} .searchDetail p input { width: 100%; font-size: 14px; border: 1px solid #616161; -webkit-border-radius:5px; float: left;} .tabArea { width: 100%; height: 25px; border: 1px solid #787878; background-color: #ddd;} .tabArea a { display: block;} .tabTextArea { width: 100%; border: 1px solid #ddd; background-color: #fff; color: #333;} .regist { position: relative; width: 100%; color: #333;} .regist label { position: absolute; left: 0; top: 5px; font-size: 14px; font-weight: bold; width: 80px;} .registLabel { position: absolute; left: 0; font-size: 14px; font-weight: bold; width: 80px;} .regist p { margin-left: 80px;} .regist p select { font-size: 14px; font-weight: bold;} .input1 { position: absolute; left: 0; top: 0;} .input { font-size: 14px; border: 1px solid #616161; -webkit-border-radius:5px;} .dataEdu th { background-color: #153a63; height: 25px; padding: 4px;} .dataEdu td { background-color: #fff; color: #333; padding: 4px; text-align: center;} .dataView th { background-color: #a8c9e0; padding: 4px; color: #23597e;} .dataView td { background-color: #fff; color: #333; padding: 4px; text-align: center;} /* 2011.01.20 */ #searchCITMS1txt { position: relative; width: 100%; float: left;} .searchCITMS1inputTxt { width: 100%; font-size: 14px; border: 1px solid #616161; float: left;} #searchCITMS1img { position: absolute; right: 15px; top: 2px;} .searchCITMS1result { border: 1px solid #a7a7a7; background-color: #f4f4f4;} #searchCITMS1resultSubject { position: relative; width: 100%; float: left;} .searchCITMS1resultSubject1 { display: block; width: 100%; font-size: 14px; color: #333; margin:0 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration:none;} .searchCITMS1resultSubject2 { width: 100%; font-size: 12px; color: #666; margin:0 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration:none;} #searchDot { position: relative; width: 100%; height: 1px; background: url(/core/mobile/images/optimus_hotpink/common/dot_1.gif); float: left;} #searchCITMS1left { position: absolute; left: 14px; top: 2px;} #searchCITMS1left label { color: #333; font-size: 14px;} #searchCITMS1right { position: relative; width: 100%; float: left;} #searchCITMS1right select { width: 100%; font-size: 14px; font-weight: bold;} #searchCITMS1right textarea { width: 100%; height: 80px; font-size: 14px; font-weight: bold;} /*2014 Navi*/ #menuNavi {width:100%; float:left; overflow:hidden;} #menuNavi p{margin-left:13px; margin-right:13px; display:inline;} #menuNavi #menuTop{display:block; line-height:100%; overflow:hidden !important; height:15px !important; width:100%; float:left; white-space: nowrap; padding-left:3px; font-size:14px; font-weight:bold; margin:0; } #menuNavi #menuTop #mstrMenu {position:relative; white-space: nowrap; float:left; } #menuNavi #menuTop #mstrMenu p { height:15px; padding:10px; } #menuNavi #menuMiddle {display:block; line-height:100%; overflow:hidden !important; height:15px !important; width:100%; float:left; white-space: nowrap; padding-left:3px; font-size:14px; font-weight:bold; margin:0;} #menuNavi #menuMiddle #mstrMenu2 {position:relative; white-space: nowrap; float:left;} #menuNavi #menuMiddle #mstrMenu2 p { height:15px; padding:10px; } #menuNavi #menuBottom {display:block; line-height:100%; overflow:hidden !important; height:15px !important; width:100%; float:left; white-space: nowrap; padding-left:3px; font-size:12px; font-weight:bold; margin:0;} #menuNavi #menuBottom #mstrMenu3 {position:relative; white-space: nowrap; float:left;} /*2014 Navi color*/ #menuNavi #menuTop {background:#a8dad3; color:#7f7f7f; background:url(/core/mobile/images/mystick_gradation/navi/depth1_bg.gif) bottom repeat-x; padding:10px 0; } #menuNavi #menuTop #depth1_on {background:#ffffff; color:#000000; height:15px; padding:10px 10px; border-left:1px solid #878787; border-right:1px solid #878787;} #menuNavi #menuMiddle {background:#ffffff; color:#7e7e7e; border-bottom:1px solid #7da29d; padding:10px 0;} #menuNavi #menuMiddle #depth2_on {background-color:#ffffff; color:#7da29d; height:15px; padding:10px 10px; background:url(/core/mobile/images/mystick_gradation/navi/depth2_onbtbg.png) bottom center no-repeat; } #menuNavi #menuBottom {background:#7da29d; color:#badcd7; padding:10px 0;} #menuNavi #menuBottom #depth3_on {background:#7da29d; color:#ffffff; height:15px; padding:10px 10px;}