@font-face { font-family:NanumGothic; src:url('../wp_default_image/NanumGothic.eot'); src:url('../wp_default_image/NanumGothic.eot?#iefix') format('embedded-opentype'), url('../wp_default_image/NanumGothic.woff') format('woff'), url('../wp_default_image/NanumGothic.ttf') format('truetype'); url('../wp_default_image/NanumGothic.svg#NanumGothic') format('svg') src:local(※), url('../wp_default_image/NanumGothic.woff') format('woff'); } @font-face { font-family:"Noto Sans KR"; font-style:normal; font-weight:300; src:url("../wp_default_image/notosanskr_300.woff") format("woff"), url("../wp_default_image/notosanskr_300.woff2") format("woff2"); } @font-face { font-family:"Noto Sans KR"; font-style:normal; font-weight:400; src:url("../wp_default_image/notosanskr_400.woff") format("woff"), url("../wp_default_image/notosanskr_400.woff2") format("woff2"); } @font-face { font-family:"Noto Sans KR"; font-style:normal; font-weight:500; src:url("../wp_default_image/notosanskr_500.woff") format("woff"), url("../wp_default_image/notosanskr_500.woff2") format("woff2"); } @font-face { font-family:"Noto Sans KR"; font-style:normal; font-weight:600; src:url("../wp_default_image/notosanskr_600.woff") format("woff"),url("../wp_default_image/notosanskr_600.woff2") format("woff2"); } @font-face { font-family:"Noto Sans KR"; font-style:normal; font-weight:700; src:url("../wp_default_image/notosanskr_700.woff") format("woff"),url("../wp_default_image/notosanskr_700.woff2") format("woff2"); } @font-face { font-family:"Noto Sans KR"; unicode-range: U+0041-005A, U+0061-007A, U+0030-0039; font-style:normal; font-weight:300; src:url("../wp_default_image/lato_300.woff") format("woff"), url("../wp_default_image/lato_300.woff2") format("woff2"); } @font-face { font-family:"Noto Sans KR"; unicode-range: U+0041-005A, U+0061-007A, U+0030-0039; font-style:normal; font-weight:400; src:url("../wp_default_image/lato_400.woff") format("woff"), url("../wp_default_image/lato_400.woff2") format("woff2"); } @font-face { font-family:"Noto Sans KR"; unicode-range: U+0041-005A, U+0061-007A, U+0030-0039; font-style:normal; font-weight:500; src:url("../wp_default_image/lato_500.woff") format("woff"), url("../wp_default_image/lato_500.woff2") format("woff2"); } @font-face { font-family:"Noto Sans KR"; unicode-range: U+0041-005A, U+0061-007A, U+0030-0039; font-style:normal; font-weight:600; src:url("../wp_default_image/lato_600.woff") format("woff"), url("../wp_default_image/lato_600.woff2") format("woff2"); } body { font-size:0.85em; font-family:Nanum Gothic, NanumGothic,dotum,돋움,Helvetica,sans-serif; color:#333; line-height:1.7em; } img, fieldset { border:0 none; } h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal; } hr { display:none; } a { color:inherit; } em, i, address { font-style:normal; font-weight:normal; } legend { display:none; clear:both; } textarea, button, select, table { font-size:inherit; font-family:inherit; line-height:inherit; } input, textarea { background:url(none); -webkit-border-radius:1px; -webkit-apprearance:none; } textarea { resize:none; } label { cursor:pointer; } button { overflow:visible; padding:0; border:0; background-color:transparent; cursor:pointer; } header, section, nav, article, aside, hgroup, footer { display:block; } a:link, a:visited, a:active { text-decoration:none; color:#333; } a:hover { text-decoration:none; color:#ff6600; } .input_chk { padding:2px 3px; border:1px solid #b7b7b7; border-right-color:#efefef; border-bottom-color:#efefef; background:url('../wp_default_image/input_require_arrow.gif') no-repeat left top; background-color:#fff; vertical-align:middle; color:#444; line-height:16px; } .input_box { padding:2px 3px; border:1px solid #b7b7b7; border-right-color:#efefef; border-bottom-color:#efefef; background-color:transparent; vertical-align:middle; color:#444; line-height:16px; } .input_box_round { height:20px; padding:6px 12px; border:1px solid #ccc; background-image:none; background-color:#fff; font-size:14px; color:#555; line-height:1.42857143; border-radius:4px; -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075); -webkit-transition:border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s; } .select_box_round { height:33px; padding:6px 12px; border:1px solid #ccc; background-image:none; background-color:#fff; font-size:14px; color:#555; line-height:1.42857143; border-radius:4px; -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075); -webkit-transition:border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s; } .textarea_chk { width:99%; padding:2px 3px; border:1px solid #b7b7b7; border-right-color:#efefef; border-bottom-color:#efefef; background:url('../wp_default_image/input_require_arrow.gif') no-repeat left top; background-color:#fff; vertical-align:middle; color:#444; line-height:16px; } .textarea_box { width:99%; padding:2px 3px; border:1px solid #b7b7b7; border-right-color:#efefef; border-bottom-color:#efefef; background-color:#fff; vertical-align:middle; color:#444; line-height:16px; } .textarea_box_round { width:99%; padding:6px 12px; border:1px solid #b7b7b7; background-image:none; background-color:#fff; vertical-align:middle; color:#444; line-height:1.42857143; border-radius:4px; -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075); -webkit-transition:border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s; } .ime_disabled { ime-mode:disabled; } .ime_active { ime-mode:active; } .select_box { float:left; position:relative; width:300px; } .select_box ul,.select_box li,.select_box dl,.select_box dt,.select_box dd,.select_box p { margin:0; padding:0; } .select_box .select_label { height:12px; padding:4px 17px 3px 5px; border:1px solid #6e706f; border-right-color:#d4d5d7; border-bottom-color:#d4d5d7; background:url('../wp_default_image/btn_select_arrow.gif') no-repeat 100% 0; background-color:#fff; line-height:12px; cursor:pointer; _cursor:hand; } .select_box .select_label span { display:block; overflow:hidden; width:100%; white-space:nowrap; text-overflow:ellipsis; } .select_box .select_data { display:none; position:absolute; top:19px; left:0; width:100%; background-color:#fff; } .select_box .select_data ul { border:1px solid #d4d5d7; border-left-color:#6e706f; border-top:0; padding:1px 2px 2px; } .select_box .select_data ul li { display:inline-block; width:100%; vertical-align:top; } .select_box .select_data ul li dl dt { display:block; display:inline-block; overflow:hidden; width:100%; margin-top:1px; color:#666; line-height:100%; cursor:pointer; _cursor:hand; } .select_box .select_data ul li dl dt span { display:block; overflow:hidden; padding:4px 3px 3px; white-space:nowrap; } .select_box .select_data ul li dl { position:relative; } .select_box .select_data ul li dl dd { display:none; position:absolute; top:-2px; left:100%; margin-left:-5px; padding-left:14px; background:url('../wp_default_image/select_arrow_tip.gif') no-repeat 10px -1px; color:#fff; line-height:15px; } .select_box .select_data ul li dl dd p { padding:4px; border:1px solid #333; border-left:0; background:#4d4d4d; white-space:nowrap; } .select_box .select_data ul li dl dd img { vertical-align:top; } .select_box .select_data ul li.on dl dd { display:block; } .select_box .select_data ul li.on dl dt { background-color:#eee; color:#000; } a.button_big { display:inline-block; padding-right:4px; background:url('../wp_default_image/button_bg.gif') no-repeat 100% 0; font-size:100%; font-weight:500; text-decoration:none; color:#666; line-height:26px; word-spacing:-1px; } a.button_big span,a.button_big strong { display:block; padding:1px 8px 0 12px; background:url('../wp_default_image/button_bg.gif') no-repeat; } a:hover.button_big { position:relative; top:1px; left:1px; } a.button_small { display:inline-block; padding-right:4px; background:url('../wp_default_image/button_bg.gif') no-repeat 100% -27px; font-size:100%; text-decoration:none; color:#666; line-height:21px; word-spacing:-1px; letter-spacing:-1px; } a.button_small span,a.button_small strong { display:block; padding:1px 4px 0 8px; background:url('../wp_default_image/button_bg.gif') no-repeat 0 -27px; } a:hover.button_small { position:relative; top:1px; left:1px; } .btn_input { color:#0000ff; } .bottom_button { padding-top:10px; text-align:center; } .bottom_button .bottom_button_spacing { padding:0 5px; } .button { display:inline-block; white-space:nowrap; margin:0.5em; padding:0 1.5em; border:1px solid #777; background-color:#ddd; background-image:linear-gradient(top, #eee, #ccc); background-image:-webkit-gradient(linear, left top, left bottom, from(#eee), to(#ccc)); background-image:-webkit-linear-gradient(top, #eee, #ccc); background-image:-moz-linear-gradient(top, #eee, #ccc); background-image:-ms-linear-gradient(top, #eee, #ccc); background-image:-o-linear-gradient(top, #eee, #ccc); font:bold 1em/2em Arial, Helvetica; text-decoration:none; color:#333; text-shadow:0 1px 0 rgba(255,255,255,.8); border-radius:.2em; -moz-border-radius:.2em; -webkit-border-radius:.2em; box-shadow:0 0 1px 1px rgba(255,255,255,.8) inset, 0 1px 0 rgba(0,0,0,.3); -moz-box-shadow:0 0 1px 1px rgba(255,255,255,.8) inset, 0 1px 0 rgba(0,0,0,.3); -webkit-box-shadow:0 0 1px 1px rgba(255,255,255,.8) inset, 0 1px 0 rgba(0,0,0,.3); } .button:hover { background-color:#eee; background-image:linear-gradient(top, #fafafa, #ccc); background-image:-webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#ccc)); background-image:-webkit-linear-gradient(top, #fafafa, #ccc); background-image:-moz-linear-gradient(top, #fafafa, #ccc); background-image:-ms-linear-gradient(top, #fafafa, #ccc); background-image:-o-linear-gradient(top, #fafafa, #ccc); } .button:active { position:relative; top:1px; left:0; box-shadow:0 0 4px 2px rgba(0,0,0,.3) inset; -moz-box-shadow:0 0 4px 2px rgba(0,0,0,.3) inset; -webkit-box-shadow:0 0 4px 2px rgba(0,0,0,.3) inset; } .button:before { float:left; width:1em; margin:0 1em 0 -1em; padding:0 .2em; background-color:#ccc; background-color:rgba(0,0,0,.1); font-size:1.5em; text-align:center; border-radius:.15em 0 0 .15em; -moz-border-radius:.15em 0 0 .15em; -webkit-border-radius:.15em 0 0 .15em; pointer-events:none; box-shadow:1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,.5); -moz-box-shadow:1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,.5); -webkit-box-shadow:1px 0 0 rgba(0,0,0,.5), 2px 0 0 rgba(255,255,255,.5); } .add:before { content:'\271A'; } .edit:before { content:'\270E'; } .delete:before { content:'\2718'; } .save:before { content:'\2714'; } .email:before { content:'\2709'; } .next_arrow:before { content:'\279C'; } .play:before { content:'\25B6'; } .table_list { width:100%; border:0; border-collapse:collapse; } .table_list caption { overflow:hidden; width:0; height:0; font-size:0; line-height:0; } .table_list th { padding:5px 0; border:1px solid #c9c9c9; border-bottom:2px solid #9b9b9b; background-color:#ececec; color:#444; vertical-align:middle; white-space:nowrap; } .table_list th label { display:none; margin:0; padding:0; } .table_list th p { display:inline-block; margin:0; padding:0; text-align:left; vertical-align:middle; } .table_list th p.order_by { line-height:0; } .table_list td { padding:5px; border:1px solid #c9c9c9; text-align:center; vertical-align:middle; word-break:break-all; } .table_list img { vertical-align:middle; } .table_list td.td_left_align { text-align:left; } .table_view { width:100%; border:0; border-collapse:collapse; } .table_view caption { overflow:hidden; width:0; height:0; font-size:0; line-height:0; } .table_view th { width:8%; padding:5px; border:1px solid #c9c9c9; border-right:2px solid #9b9b9b; background-color:#ececec; color:#444; text-align:left; vertical-align:middle; white-space:nowrap; } .table_view td { padding:5px; border:1px solid #c9c9c9; background-color:#fff; vertical-align:middle; } .table_view img { vertical-align:middle; } .table_view .view_bottom_line { border-bottom:1px solid #8e8e8e; } .table_input { width:100%; border:0; border-collapse:collapse; } .table_input caption { overflow:hidden; width:0; height:0; font-size:0; line-height:0; } .table_input th { width:8%; padding:5px; border:1px solid #c9c9c9; border-right:2px solid #9b9b9b; background-color:#ececec; color:#444; text-align:left; vertical-align:middle; white-space:nowrap; } .table_input td { padding:5px; border:1px solid #c9c9c9; background-color:#fff; vertical-align:middle; } .table_input td select { margin:0; padding:2px; border:1px solid #b7b7b7; } .table_input td label { margin:0; padding-right:5px; } .table_input img { vertical-align:middle; } .table_input p { margin:0; padding:0; } .table_input .view_bottom_line { border-bottom:1px solid #8e8e8e; } .table_input .spacing_height { padding-top:3px; } #table_bottom { overflow:hidden; clear:both; padding:20px 0; } #table_bottom .left_button { float:left; width:33%; } #table_bottom .right_button { float:right; width:33%; text-align:right; } #table_bottom .center_button { text-align:center; } #table_bottom .center_page { float:left; height:22px; margin-top:5px; padding:0; width:33%; text-align:center; vertical-align:middle; } #keyword_search { display:inline-block; margin-left:40%; padding:3px 5px; border:1px solid #b7b7b7; text-align:center; } #keyword_search button { margin:0; padding:2px 3px 0; border:1px solid #b7b7b7; color:#666; } #keyword_search button:hover { color:#000; } #keyword_search .search_input { width:150px; margin:2px; padding:3px; border:1px solid #b7b7b7; border-right-color:#e1e1e1; border-bottom-color:#e1e1e1; background-color:transparent; } #preview_content { display:none; margin:0; padding:0; border:0; } .board_list { background:url('../wp_default_image/board_head.gif') no-repeat 0 -100px; } .board_list table { width:100%; border:0; border-bottom:1px solid #cdcdcd; border-collapse:collapse; background:url('../wp_default_image/board_head.gif') no-repeat right -100px; color:#4a4a4a; } .board_list caption { overflow:hidden; width:0; height:0; font-size:0; line-height:0; } .board_list th { height:14px; padding:5px 0 9px 0; border:0; font-size:95%; white-space:nowrap; } .board_list th span { display:block; padding:0 15px; border-left:1px solid #c7c7c7; } .board_list tr.notice { background-color:#f1f1f1; } .board_list td { padding:5px 10px; border:0; border-bottom:1px solid #e6e6e6; text-align:center; vertical-align:middle; white-space:nowrap; } .board_list td.subject { display:block; overflow:hidden; width:480px; white-space:nowrap; text-overflow:ellipsis; } .board_list td.td_align_left { text-align:left; } .board_list img { vertical-align:middle; } #board_list_ment { display:inline-block; margin-bottom:20px; } .board_division_icon { display:inline-block; width:60px; margin-right:5px; padding:3px; background-color:#555; font-size:95%; font-weight:500; text-align:center; color:#fff; vertical-align:middle; border-radius:5px; } .board_faq_close { display:inline-block; position:relative; top:0; left:0; padding:4px; background-color:#fe6421; font-weight:500; text-align:center; color:#fff; vertical-align:bottom; line-height:10px; } .board_faq_reply { display:inline-block; padding:5px; border:2px solid #ccc; background-color:#eaeaea; font-weight:500; color:#999; border-radius:5px; } .board_view_title { background:url('../wp_default_image/board_head.gif') no-repeat 0 -50px; background-color:#fff; zoom:1; } .board_view_head { position:relative; border-top:2px solid #8d5944; background-color:#eed6bc; } .board_view_head h4 { overflow:hidden; height:50px; margin:0 0 0 15px; font-size:130%; font-weight:400; text-align:center; color:#000; line-height:50px; white-space:nowrap; } .board_view_head .time { display:none; position:absolute; top:11px; right:12px; margin:0; font-size:85%; color:#bfbfbf; } .board_view_head .name_row { display:none; height:18px; margin:0; padding:8px 10px 8px 15px; border-bottom:1px solid #ddd; background-color:#f6f6f6; font-size:11px; color:#666; zoom:1; } .board_view_head .name { float:left; font-weight:500; } .board_view_head .name_row img { vertical-align:middle; } .board_view_head .ref { float:right; margin-top:-2px; } .board_view_head .ref img { vertical-align:middle; } #board_view_comment { margin:0; padding:15px 0; } #board_collection_view { margin:0 auto; padding:0; } #board_input { margin:0; padding:0; border:0; } #board_input legend { display:none; margin:0; padding:0; } #board_input ul { margin:0; padding:5px; border:2px solid #c9c9c9; list-style:none; } #board_input li { margin:0 20px; padding:7px 0; } #board_input li img { vertical-align:middle; } #board_input li.bottom_line { border-bottom:1px dotted #ccc; } #board_input span { font-weight:lighter; color:#444; } #board_input label { display:inline-block; width:100px; } #board_input label span { color:#cc0000; vertical-align:baseline; } #board_input label.sub_label { display:inline; margin:0; padding:0 3px; } #board_input ul.attach_file { padding:10px 0; } #board_input ul.attach_file li { padding:3px 0; } #board_input .info_span { font-size:90%; color:#999; } #board_help_list { margin:0; padding:0; border-bottom:2px solid #999; } #board_help_list li { border-bottom:1px solid #e6e6e6; } #board_help_list li > h4 { margin:0; padding:10px 10px 10px 20px; background:url('../wp_default_image/tree_open.gif') no-repeat 5px center; background-color:#f1f1f1; cursor:pointer; } #board_help_list li > h4 img { vertical-align:middle; } #board_help_list li > h4.notice { border:1px solid #bbb; font-size:120%; } #board_help_list li > div { display:none; padding:10px; border-top:1px solid #e6e6e6; white-space:pre-line; } #board_help_list .on { background:url('../wp_default_image/tree_close.gif') no-repeat 5px center; background-color:#f1f1f1; font-size:110%; font-weight:500; cursor:pointer; } .board_gallery_list { overflow:hidden; margin:0; padding:0 0 10px; border-bottom:2px solid #999; } .board_gallery_list li { display:inline; float:left; margin:0 15px 40px; padding-bottom:10px; text-align:center; } .board_gallery_list .gallery_image { display:block; margin:0; padding:0; border-radius:3px; } .board_gallery_list .gallery_subject { display:block; overflow:hidden; margin:0; padding-top:5px; white-space:nowrap; text-overflow:ellipsis; } .board_gallery_list .gallery_ref { font-size:90%; color:#555; } .board_gallery_list .gallery_other { display:block; margin:0; padding-top:5px; font-size:90%; color:#666; } .board_gallery_list .gallery_name { display:block; margin:0; padding-top:2px; } .board_gallery_list .gallery_name a { font-size:110%; font-weight:500; color:#5d95a0; } .board_gallery_list .gallery_button { display:block; margin:0; padding-top:2px; } .board_gallery_list .gallery_best { position:absolute; margin:0; } .board_collection_list { overflow:hidden; clear:both; margin:0; padding:0 0 10px; border-bottom:2px solid #999; } .board_collection_list li { display:inline; float:left; margin:0 15px 10px 0; padding-bottom:10px; font-size:100%; text-align:center; } .board_collection_list .collection_image { display:block; margin:0; padding:0; border:1px solid #fff; } .board_collection_list .collection_subject { display:block; margin:0; padding-top:10px; font-weight:500; color:#444; } .board_collection_list .collection_comment { display:block; margin:0; padding-top:10px; font-size:90%; color:#666; text-align:left; } .board_collection_list .collection_button { display:block; margin:0; padding-top:5px; font-size:90%; } .board_blog_list { margin:0; padding:0 0 10px; border-bottom:2px solid #999; list-style:none; } .board_blog_list li { overflow:hidden; clear:both; margin-bottom:20px; padding-bottom:20px; border-bottom:1px dotted #ccc; } .board_blog_list .blog_image { display:inline-block; float:left; margin-right:10px; } .board_blog_list .blog_photo { padding:5px; border:2px solid #ccc; } .board_blog_list .blog_image .blog_content { display:inline-block; } .board_blog_list .blog_content .blog_subject { display:block; margin:0; padding:3px 0 5px 0; } .board_blog_list .blog_content .blog_subject a { color:#666; } .board_blog_list .blog_content .blog_comment { display:block; margin:0; padding-bottom:5px; color:#666; } .board_blog_list .blog_content .blog_date { display:block; font-size:90%; color:#999; } .event_list { margin-top:0; padding-bottom:10px; border-bottom:2px solid #999; } .event_list li { overflow:hidden; clear:both; margin-bottom:20px; padding-bottom:20px; border-bottom:1px dotted #ccc; font-size:100%; } .event_list .event_image { display:inline-block; float:left; margin-right:10px; } .event_list .event_image img { padding:3px; border:1px solid #ccc; } .event_list .event_image .event_content { display:inline-block; } .event_list .event_content .subject { display:block; margin:0; padding:3px 0 5px 0; } .event_list .event_content .subject a { font-size:110%; font-weight:500; color:#666; } .event_list .event_content .subject { display:block; margin:0; padding:3px 0 5px 0; } .event_list .event_content .period { display:block; margin:0; padding:3px 0; } .event_list .event_content .special { display:block; margin:0; padding-bottom:5px; color:#999; } .event_list .event_content .date { display:block; font-size:90%; color:#999; } .event_view { margin-top:20px; padding:0; } #board_auth { margin:0; padding:0; border:0; } #board_auth p { text-align:center; } #board_bottom { overflow:hidden; clear:both; padding:20px 0; } #board_bottom .left_search { float:left; width:25%; } #board_bottom .right_button { float:right; width:15%; text-align:right; } #board_bottom .center_paging { float:left; height:30px; margin-top:5px; padding:0; width:60%; text-align:center; } #board_keyword_search { display:inline-block; margin:2px; padding:2px; border:1px solid #b7b7b7; text-align:center; vertical-align:middle; } #board_keyword_search .search_input { width:110px; margin:2px; padding:5px; border:1px solid #b7b7b7; border-right-color:#e1e1e1; border-bottom-color:#e1e1e1; background-color:transparent; font-size:95%; color:#999; } #board_keyword_search button { margin:0; padding:2px 3px 0; border:1px solid #b7b7b7; color:#666; } #board_keyword_search button:hover { background-color:#666; color:#fff; } .reply_list { clear:both; margin:0; padding:10px 0; border-bottom:1px dotted #ccc; font-size:95%; color:#444; } .reply_list img { padding-right:5px; vertical-align:middle; } .reply_list .list_reply_name { float:left; } .reply_list .list_reply_button { float:right; } .reply_list .list_reply_comment { clear:both; margin:0; padding-top:10px; } .reply_list_page { clear:both; margin:0 auto; padding:20px; text-align:center; } .reply_input { margin:0; padding:0; border:2px solid #c9c9c9; } .reply_input fieldset { margin:0; padding:0; border:0; } .reply_input legend { display:none; margin:0; padding:0; } .reply_input ul { margin:0; padding:5px; list-style:none; } .reply_input li { margin:0 20px; padding:5px 0; } .reply_input li.bottom_line { border-bottom:1px dotted #ccc; } .reply_input span { font-size:90%; font-weight:lighter; color:#444; } .reply_input label { display:inline-block; width:50px; } .reply_input label.sub_label { display:inline; margin:0; padding:0 3px; } .reply_input label span { color:#cc0000; vertical-align:baseline; } .reply_input .first_emoticon { margin:0; padding:2px; } .reply_input #comment_emoticon { position:relative; top:0; left:0; } .reply_input #comment_emoticon .reply_emoticon { display:none; overflow:visible; position:absolute; top:17px; left:22px; width:40px; margin:0; padding:3px; border:1px solid #ccc; background-color:#fff; } .reply_input #reply_comment_emoticon { position:relative; top:0; left:0; } .reply_input #reply_comment_emoticon .reply_emoticon { display:none; overflow:visible; position:absolute; top:17px; left:22px; width:40px; margin:0; padding:3px; border:1px solid #ccc; background-color:#fff; } .reply_input textarea { width:90%; height:65px; padding:2px 3px; border:1px solid #b7b7b7; border-right-color:#efefef; border-bottom-color:#efefef; background:url('../wp_default_image/input_require_arrow.gif') no-repeat left top; background-color:#fff; vertical-align:middle; color:#444; line-height:16px; } .reply_input .reply_send_button { position:relative; top:20px; left:5px; } .reply_modify { margin:10px 0; border:2px solid #ff8000; } .reply_delete_button { vertical-align:middle; } .reply_box { clear:both; margin:10px 0; padding-bottom:20px; } .reply_reply_arrow { float:left; margin:0; font-size:105%; font-weight:500; color:#444; } .reply_reply { float:right; width:96%; margin:0; padding:0; border:2px solid #ff8000; } #reply_reply { float:right; width:92%; margin:0; padding:0; border:2px solid #ff8000; } .reply_reply fieldset { margin:0; padding:0; border:0; } .reply_reply legend { display:none; margin:0; padding:0; } .reply_reply ul { margin:0; padding:5px; list-style:none; } .reply_reply li { margin:0 20px; padding:5px 0; } .reply_reply li.bottom_line { border-bottom:1px dotted #ccc; } .reply_reply span { font-size:90%; font-weight:lighter; color:#444; } .reply_reply label { display:inline-block; width:50px; } .reply_reply label.sub_label { display:inline; margin:0; padding:0 3px; } .reply_reply label span { color:#cc0000; vertical-align:baseline; } .reply_reply .first_emoticon { margin:0; padding:2px; } .reply_reply #reply_comment_emoticon { position:relative; top:0; left:0; } .reply_reply #reply_comment_emoticon .reply_emoticon { display:none; overflow:visible; position:absolute; top:17px; left:22px; width:40px; margin:0; padding:3px; border:1px solid #ccc; background-color:#fff; } .reply_reply textarea { width:90%; height:65px; padding:2px 3px; border:1px solid #b7b7b7; border-right-color:#efefef; border-bottom-color:#efefef; background:url('../wp_default_image/input_require_arrow.gif') no-repeat left top; background-color:#fff; vertical-align:middle; color:#444; line-height:16px; } .reply_reply .reply_send_button { position:relative; top:20px; left:5px; } .reply_reply #reply_comment { width:90%; height:65px; padding:2px 3px; border:1px solid #b7b7b7; border-right-color:#efefef; border-bottom-color:#efefef; background:url('../wp_default_image/input_require_arrow.gif') no-repeat left top; background-color:#fff; vertical-align:middle; color:#444; line-height:16px; } #reply_body { overflow:hidden; margin:0; padding:0; } #reply_iframe { margin:10px 0; padding:0; } #reply_frame { width:100%; height:100%; margin:0; padding:0; border:0 solid transparent; } #reply_title { margin-bottom:0; padding:0 0 5px 22px; border-bottom:#666 2px solid; background:url('../wp_default_image/icon_reply.gif') no-repeat left top; font-size:95%; } .table_file_down { width:98%; margin:3px; padding:5px; border:2px solid #c7c7c7; } .table_file_down legend { padding:0 5px; } .table_down_box { margin-top:10px; padding:5px; border:4px solid #e6e6e6; background-color:#fafafa; text-align:left; } #attach_modify { margin:0; padding:5px; border:1px solid #b7babc; list-style:none; } #attach_modify li { padding:5px 0; border-bottom:1px dotted #ccc; } #attach_modify .first_line { border-bottom:1px solid #b7babc; } #attach_modify .attach_sort { display:inline-block; width:100px; text-align:center; vertical-align:middle; } #attach_modify .attach_file { display:inline-block; width:400px; vertical-align:middle; } #attach_modify .attach_file img { float:left; padding-right:10px; } #attach_modify .attach_delete { display:inline-block; width:50px; text-align:center; vertical-align:middle; } #board_required_message { margin:0; padding-bottom:5px; text-align:right; color:#444; } #board_required_message img { vertical-align:text-top; } #board_prev_next { margin-top:10px; padding:5px; border:1px solid #c9c9c9; list-style:none; } #board_prev_next li { margin:0; padding:3px 0; } #board_prev_next .prev_nex_line { border-bottom:1px dotted #ccc; } .page_move_box { margin:0; padding:0; } .page_move_box .number { margin:0 3px; font-weight:400; word-spacing:0.1em; } .page_move_box .number a, .page_move_box .number strong { padding:5px 5px 4px 5px; border:1px solid #eaeaea; text-align:center; text-decoration:none; color:#666; } .page_move_box .number strong { color:#ff6600; border:2px solid #ff6600; } .page_move_box .number a { color:#666; } .page_move_box .number a:hover { border:1px solid #ff6600; color:#000; } .page_move_box span.none { color:#666; cursor:default; } .page_move_box .none a { font-weight:500; text-decoration:none; color:#000; } .page_move_box .none a:hover { font-weight:500; text-decoration:underline; color:#ff6600; } .page_move { margin:0; padding:0; } .page_move a, .page_move strong { display:inline-block; position:relative; padding:3px 8px 2px 8px; background:url('../wp_default_image/page_move_line.gif') no-repeat 0 5px; font-weight:500; text-decoration:none; color:#666; line-height:normal; } .page_move strong { color:#ff1315; } .page_move a:hover, .page_move a:active, .page_move a:focus { background-color:#f7f7f7; font-weight:500; text-decoration:none; color:#000; line-height:normal; } .page_move a.prev, .page_move a.next { } .page_move a.prev { margin-right:-5px; padding:4px 10px 2px 17px; background:url('../wp_default_image/page_move_prev.gif') no-repeat left center; } .page_move a.next { padding:4px 18px 2px 11px; background:url('../wp_default_image/page_move_next.gif') no-repeat right center; } .privacy .title { margin:0 0 40px; padding:0 0 20px; border-bottom:1px solid #ccc; font-size:120%; text-align:center; line-height:160%; } .privacy h5 { margin:0; padding:10px; border-bottom:2px solid #999; font-size:120%; font-weight:500; } .privacy h5 .round { display:inline-block; margin-right:8px; padding:3px 10px; background-color:#666; color:#fff; border-radius:9px; } .privacy .comment { margin-bottom:40px; padding:20px; border:1px solid #ccc; border-top:none; line-height:160%; word-break:keep-all; } .privacy .comment.last { margin-bottom:0; } .privacy .comment p { margin:0; padding:0; } .privacy .comment ul ul li { padding:5px 0; list-style:disc; } .privacy .comment ol ul li { padding:5px 0; list-style:disc; } .privacy .comment ol > li { padding:5px 0; list-style:decimal; } .privacy .comment ol > li > ul > li > ul > li { padding:5px 0; list-style:upper-roman; } .privacy .comment ol { margin-left:0; padding-left:20px; } .privacy .comment ul { margin-left:20px; padding-left:0; } #popup_form { border:0; } #popup_form legend { visibility:hidden; overflow:hidden; position:absolute; top:0; left:0; margin:0; padding:0; } .round_box { margin:0; padding:10px; border:2px solid #ccc; border-radius:10px; } .plan_list { margin:0; padding:0; } .plan_list p { margin:0; padding-bottom:10px; text-align:center; vertical-align:middle; } .plan_list p span { display:inline-block; margin:0; padding:0 10px; font-size:220%; font-family:Helvetica; font-weight:500; color:#333; vertical-align:middle; } .plan_list table { width:100%; border:0; border-collapse:collapse; } .plan_list caption { overflow:hidden; width:0; height:0; font-size:0; line-height:0; } .plan_list th { height:40px; border-top:2px solid #999; border-bottom:1px solid #ccc; background-color:#fff; } .plan_list th .english { font-size:80%; font-family:Helvetica; font-weight:lighter; } .plan_list td { height:100px; padding:5px; border-bottom:1px solid #ddd; background-color:#fff; vertical-align:top; } .plan_list td .subject { font-size:90%; } .plan_list img { vertical-align:middle; } .plan_view { margin:0; padding:10px; border:2px solid #ccc; } #plan_head { margin:0; padding:5px 0; text-align:center; } #plan_main { width:100%; margin:0; padding:0; } #plan_main td { text-align:center; } #plan_main .sunday { background-color:#cb5032; color:#fff; } #plan_main .monday { background-color:#877b7b; color:#fff; } #plan_main .tuesday { background-color:#a09292; color:#fff; } #plan_main .wednesday { background-color:#877b7b; color:#fff; } #plan_main .thursday { background-color:#a09292; color:#fff; } #plan_main .friday { background-color:#877b7b; color:#fff; } #plan_main .saturday { background-color:#3689B7; color:#fff; } #plan_main .plan { background-color:#ffff00; } #plan_main .today { border:#999 1px solid; background-color:#ddd; font-weight:500; color:#000; } #plan_main .plan_view { width:150px; margin:0; padding:5px; border:#ccc 1px solid; background-color:#fff; text-align:left; color:#666; } #plan_main .plan_view span { display:block; margin:0; padding:0; border-bottom:#ccc 1px dotted; background-color:#fff; font-size:100%; color:#666; } .member_agree { padding:10px; border:2px solid #ccc; } .member_agree legend { display:block; margin:0; padding:0 20px; background:url('../wp_default_image/gray_dot.gif') no-repeat 0 center; font-size:120%; font-weight:500; color:#444; } .member_agree span { font-size:90%; font-weight:lighter; color:#444; } .member_agree textarea { margin:10px 0 0 -5px; padding:10px 5px; width:100%; border:0; color:#333; } .member_agree p { margin:0; padding-top:10px; font-weight:500; text-align:center; } .member_agree p.auth_box { margin-left:20px; text-align:left; } .member_agree p.auth_box label { display:inline-block; width:130px; font-size:120%; } .member_agree p.auth_box input { height:18px; } .member_agree p.auth_box span { font-size:100%; } .member_input { padding:0 10px; border:2px solid #ccc; } .member_input legend { display:block; margin:0; padding:0 20px; background:url('../wp_default_image/gray_dot.gif') no-repeat 0 center; font-size:120%; font-weight:500; color:#444; } .member_input span { font-size:90%; font-weight:lighter; color:#444; } .member_input span.member_required_emphasis { font-weight:500; color:#cc0000; } .member_input span img { vertical-align:text-top; } .member_input ul { padding:15px; list-style:none; } .member_input li { padding:7px 0; vertical-align:middle; } .member_input li.top_line { border-top:1px solid #ccc; } .member_input li.bottom_line { border-bottom:1px dotted #ccc; } .member_input li span { padding-left:10px; font-size:100%; font-weight:lighter; color:#444; } .member_input li span.new_passwd { margin:0; padding-left:105px; } .member_input li img { vertical-align:middle; } .member_input label { display:inline-block; width:100px; } .member_input label span { margin-left:-10px; color:#cc0000; vertical-align:baseline; } .member_input label.sub_label { display:inline; margin:0; padding:0 3px; } .member_retire_textarea { width:84%; padding:6px 12px; border:1px solid #b7b7b7; background-image:none; background-color:#fff; vertical-align:middle; color:#444; line-height:1.42857143; border-radius:4px; -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow:inset 0 1px 1px rgba(0, 0, 0, .075); -webkit-transition:border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s; } .check_id_box { width:500px; margin:0 auto; padding:0; font-size:110%; text-align:center; } .check_id_box h3 { margin-top:50px; padding:0; font-size:240%; text-align:center; color:#000; } .check_id_box span { margin:20px 0; padding:5px; } .check_id_box p { margin:0 20px; padding:35px; border:2px solid #444; background-color:#fff; text-align:center; vertical-align:middle; } .check_id_box p .id { font-weight:500; color:#000; } .check_id_box span.btn_confirm a { display:inline-block; margin:20px 0; padding:7px 30px; background-color:#444; color:#fff; } #member_login { margin:0 auto; padding:0; border:0; border:1px solid #ccc; border-bottom:1px solid #ccc; } #member_login .login_box { overflow:hidden; margin:0 auto; padding:30px; border-bottom:1px solid #ccc; background-color:#eee; } #member_login .login_box .wrap { width:70%; margin:0 auto; padding:0; } #member_login .login_box .wrap .item { width:70%; float:left; margin-left:20px; padding:0; } #member_login .login_box .wrap .item img { padding-right:10px; vertical-align:middle; } #member_login .login_box .wrap .item p { margin:0; padding-bottom:5px; } #member_login .login_box .wrap .item p input { width:300px; height:30px; padding-left:20px; border:1px solid #ccc; background-color:#fbffc6; font-weight:500; vertical-align:middle; color:#333; } #member_login .login_box .wrap .login_button { float:left; margin:1px 0 0 10px; padding:0; } #member_login .login_box .wrap .login_button .member_login_button { margin:0; padding:0; width:100px; height:90px; border:1px #222 solid; background-color:#444; font-size:170%; font-weight:500; color:#fff; box-shadow:0px 1px 1px rgba(0,0,0,0.3); border-radius:5px; } #member_login .login_explain { overflow:hidden; margin:0 auto; padding:30px 0; } #member_login .login_explain .item { width:90%; margin:0 auto; padding:0; } #member_login .login_explain .item li { display:inline-block; margin:0; padding:0 5%; border-left:1px solid #ccc; font-size:120%; text-align:left; list-style:none; } #member_login .login_explain .item li:first-child { border-left:none; } #member_login .login_explain .item li .login_other_button { display:inline-block; margin:0; padding:5px 20px; background-color:#777; } #member_login .login_explain .item li .login_other_button a { color:#fff; } #dm_member_login { float:left; margin:0; padding:0; border:0; } #dm_member_login ul { margin:0; padding:0; } #dm_member_login li { padding:2px 0; vertical-align:middle; } #dm_member_login li label { visibility:visible; position:relative; margin:3px 0 0 5px; color:#999; } #dm_member_login li input { width:110px; height:16px; border:2px solid #ccc; font-weight:500; color:#666; vertical-align:middle; } #dm_member_login .member_login_button { position:relative; top:-15px; left:0; } #dm_member_login p { margin:0; padding:0; text-align:center; } #member_search { overflow:hidden; margin:0; padding:0; border:0; } #member_search h3 { margin:0; padding:20px 0; border-bottom:2px solid #000; font-size:240%; font-weight:500; text-align:center; color:#000; } #member_search h3 img { margin-right:20px; vertical-align:middle; } #member_search .ment { margin:0; padding:20px 0; border-bottom:1px solid #ccc; background-color:#fff; text-align:center; color:#000; } #member_search ul { margin:0; padding:10px; border-bottom:1px solid #ccc; list-style:none; } #member_search li { padding:5px 0; vertical-align:middle; } #member_search li span { padding-left:5px; color:#444; } #member_search .button_confirm { margin:0; padding:5px 30px; border:1px #222 solid; background-color:#444; color:#fff; } #member_search .button_cancel { margin:0; padding:5px 30px; border:1px #bfbfbf solid; background-color:#ddd; color:#000; } #member_search label { display:inline-block; width:100px; } #member_search label span { margin-left:-5px; color:#cc0000; vertical-align:baseline; } #member_search p { margin:0; padding:20px 0; background-color:#fff; text-align:center; } #member_search .member_search_pw { margin:0; padding:10px; border-top:1px solid #ccc; border-bottom:1px solid #ccc; background-color:#ddd; } #attach_file { margin:0; padding:0; list-style:none; } #attach_file li { margin:0; padding:3px 0; } #attach_file li.bottom_line { border-bottom:1px dotted #ccc; } #print_wrap { margin:0; padding:0; border:2px solid #ccc; } #print_wrap p { margin:0; padding:0; } #print_head { margin:0px; padding:7px; border:1px solid #fff; background-color:#666; color:#fff; } #print_subject { float:left; font-size:110%; font-weight:500; } #print_name { font-size:90%; text-align:right; } #print_comment { margin:0; padding:10px; } #statistic_graph h4 { margin:0; padding:0 0 5px 15px; border-bottom:1px solid #666; background:url('../wp_default_image/icon_gray_arrow.gif') no-repeat 0 5px; font-size:110%; font-weight:500; color:#444; vertical-align:middle; } #statistic_graph h4 span { font-size:95%; font-weight:lighter; } #statistic_graph h4 select { height:20px; margin:0; padding:0; font-size:95%; } #statistic_graph ul { margin:0 0 0 140px; padding:1px 0 0 0; border:1px solid #ddd; border-top:0; border-right:0; } #statistic_graph li { position:relative; margin:10px 0; vertical-align:top; white-space:nowrap; list-style:none; } #statistic_graph .graph_name { position:absolute; top:0; left:-160px; width:150px; text-align:center; color:#3a3a3a; vertical-align:middle; line-height:20px; } #statistic_graph .graph_bar { display:inline-block; position:relative; height:20px; border:1px solid #ccc; border-left:0; background-color:#e9e9e9; } #statistic_graph .graph_bar span { position:absolute; top:0; right:-160px; width:150px; color:#767676; line-height:20px; } #sms_send { margin:0 auto; padding:10px; text-align:center; } #sms_consult { margin:0; padding:0; border:0; } #sms_consult li { margin:0; padding-bottom:7px; } #sms_consult .sms_tel_box { width:25px; } #sms_consult .sms_send_button { position:relative; top:0; left:0; margin:0; padding:0; } #search_keyword_box { position:relative; left:62px; top:2px; margin:0; padding:0; } #search_keyword_box #search_keyword_list { position:absolute; left:0; top:0; z-index:100; width:275px; margin:0; padding:10px; border:1px solid #ccc; background-color:#fff; font-size:90%; } #search_keyword_box #search_keyword_list li { margin:0; padding:3px 0; cursor:pointer; } #search_keyword_box #search_keyword_list li:hover { font-weight:500; color:#444; } .sub_tab_menu { position:relative; height:25px; padding-left:10px; background:url('../wp_default_image/sub_tab_menu.gif') repeat-x 0 100%; font-size:100%; } .sub_tab_menu ul { margin:0; padding:0; list-style:none; } .sub_tab_menu ul li { float:left; margin:0; margin-right:-1px; padding:0; line-height:22px; } .sub_tab_menu ul li, .sub_tab_menu ul li a { background:url('../wp_default_image/sub_tab_off.gif') no-repeat; } .sub_tab_menu ul li a { display:inline-block; padding:2px 16px 1px; _padding:3px 16px 0; background-position:100% 0; font-weight:500; color:#666; text-decoration:none !important } .sub_tab_menu ul li.menu_on, .sub_tab_menu ul li.menu_on a { background-image:url('../wp_default_image/sub_tab_on.gif'); } .sub_tab_menu ul li.menu_on a { font-weight:500; color:#ff7141; } .float_left { float:left; } .float_right { float:right; } .clear_both { clear:both; } .text_blue { color:#0000ff; } .text_red { color:#ff0000; } .text_big { font-size:120%; } .text_small { font-size:90%; } .text_bold { font-weight:500; } .text_strong { font-weight:500; } .text_left { text-align:left; } .text_right { text-align:right; } .text_center { text-align:center; } .text_emphasis { font-weight:500; color:#cc0000; } .display_none { display:none; } .border_line { border:1px solid #ccc; } .example { padding-left:10px; color:#666; } .image_view_box { padding:5px; text-align:center; } .image_view_box img { max-width:100%; height:inherit; } .image_list_view ul { margin:0; padding:0; } .image_list_view li { float:left; margin:3px; padding:5px; border:1px solid #ccc; } .tip_icon_box { display:inline-block; margin:0; padding:0 3px; background-color:#555; font-size:95%; font-weight:500; color:#ffff00; vertical-align:middle; border-radius:5px; } #admin_login_wrap { width:100%; height:100%; } #admin_login_container { position:absolute; top:50%; left:50%; width:487px; height:333px; margin:-166px 0 0 -243px; padding:0; background:url('../wp_default_image/admin_login.jpg') repeat-x; } #admin_login_container h1 { margin:15px 0 0 30px; padding:0; font-size:120%; font-weight:bold; color:#5a5a5a; } #admin_login_container h1 span { color:#e84a41; } #admin_login_container a { color:#fff; } #admin_login_box { margin:0; padding:99px 0 0 80px; border:0; color:#444; } #admin_login_box legend { overflow:hidden; visibility:hidden; position:absolute; top:0; left:0; margin:0; padding:0; } #admin_login_box p { width:200px; margin:0; padding:0; font-weight:bold; text-align:right; } #admin_login_box p, .admin_fieldset_padding { margin:0; padding-top:4px; } #admin_login_box .admin_login_input { width:110px; height:20px; background-color:#fff; ime-mode:disabled; } #admin_login_box .admin_login_button { position:relative; top:-59px; left:210px; width:101px; height:46px; } #admin_login_menu { margin:-15px 0 0 70px; padding:0; } #admin_login_copy { margin-top:30px; padding:0; text-align:center; text-decoration:none; color:#333; } #admin_body { margin:0; padding:0; font-size:75%; } #admin_header { height:90px; border-top:3px solid #101010; border-bottom:2px solid #404040; background:url('../wp_default_image/admin_top_bg.gif') repeat; } #admin_aside { float:left; clear:both; width:200px; margin:0; padding:0; } #admin_section { overflow:auto; margin:0; padding:10px; } #admin_footer { overflow:hidden; clear:both; height:40px; margin:0; } #admin_top_logo { float:left; width:200px; margin:0; padding:0; text-align:center; font-weight:bold; } #admin_top_logo h1 { margin:0; padding:0; } #admin_top_logo p { height:20px; margin-top:-1px; padding-top:2px; background-color:#666; font-size:110%; color:#fff; vertical-align:middle; } #admin_top_time { margin:0; padding:0; } #admin_top_menu { margin:0; padding:0; } #admin_top_menu ul { float:left; width:800px; margin:0; padding:0; } #admin_top_menu li { display:inline; margin:0; padding:0; font-weight:lighter; } #admin_top_menu a { float:left; margin:0; padding:0 0 0 4px; background:url('../wp_default_image/admin_top_left.gif') no-repeat left -13px; text-decoration:none; } #admin_top_menu a span { display:block; float:left; padding:5px 15px 4px 6px; background:url('../wp_default_image/admin_top_right.gif') no-repeat right -13px; color:#fff; } #admin_top_menu a span { float:none; } #admin_top_menu a:hover span { font-weight:bold; color:#ffff00; } #admin_top_menu a:hover { background-position:0% -56px; } #admin_top_menu a:hover span { background-position:100% -56px; } #admin_top_menu #current a { background-position:0% -42px; } #admin_top_menu #current a span { background-position:100% -42px; } #admin_top_menu .login_ment { display:inline-block; margin-left:10px; padding:5px 0 4px; font-weight:bold; letter-spacing:1px; } #admin_main_menu { margin:0; padding:0; } #admin_main_menu ul { margin-top:-7px; padding:0; } #admin_main_menu li { float:left; list-style:none; } #admin_main_menu li a span { display:inline-block; width:132px; height:28px; margin:0; padding-top:9px; background-color:#fff; font-size:130%; font-weight:700; text-align:center; text-decoration:none; color:#313131; letter-spacing:2px; cursor:pointer; } #admin_main_menu li a span { border-top:1px solid #adadad; border-right:1px solid #adadad; } #admin_main_menu li .sub_menu_box { border-left:1px solid #adadad; } #admin_main_menu li ul { display:none; overflow:hidden; position:absolute; top:73px; left:200px; z-index:2; margin:0; padding-left:10px; height:18px; } #admin_main_menu.admin_menu_01 .admin_menu_01 span { background-color:#666; color:#ffff00; } #admin_main_menu.admin_menu_02 .admin_menu_02 span { background-color:#666; color:#ffff00; } #admin_main_menu.admin_menu_03 .admin_menu_03 span { background-color:#666; color:#ffff00; } #admin_main_menu.admin_menu_04 .admin_menu_04 span { background-color:#666; color:#ffff00; } #admin_main_menu.admin_menu_05 .admin_menu_05 span { background-color:#666; color:#ffff00; } #admin_main_menu.admin_menu_06 .admin_menu_06 span { background-color:#666; color:#ffff00; } #admin_main_menu.admin_menu_01 .admin_menu_01 ul { display:block; } #admin_main_menu.admin_menu_02 .admin_menu_02 ul { display:block; } #admin_main_menu.admin_menu_03 .admin_menu_03 ul { display:block; } #admin_main_menu.admin_menu_04 .admin_menu_04 ul { display:block; } #admin_main_menu.admin_menu_05 .admin_menu_05 ul { display:block; } #admin_main_menu.admin_menu_06 .admin_menu_06 ul { display:block; } .admin_sub_menu > li { color:#fff; } .admin_sub_menu > li:first-child { padding-right:5px; font-size:95%; color:#ffff00; } .admin_sub_menu .admin_menu_line { padding:0 5px; font-weight:bold; } .admin_sub_menu .admin_wp_menu a { font-weight:bold; color:#ffff00; } .admin_sub_menu .admin_wp_menu a:hover { font-weight:bold; text-decoration:underline; color:#ffff80; } .admin_sub_menu a { color:#fff; } .admin_sub_menu a:hover { color:#dbf659; } #admin_sub_bg { clear:both; position:relative; top:-22px; height:22px; margin-left:200px; background-color:#0090f1; color:#fff; } #admin_aside_contents { margin:2px; padding:5px; border:1px solid #adadad; } #admin_aside_contents h3 { margin:0; padding:3px; border:1px solid #adadad; background-color:#efefef; font-weight:bold; text-align:center; color:#666; } #admin_aside_contents ul { margin:0 auto; padding:3px 7px; border:1px solid #adadad; list-style:none; } #admin_aside_contents .volume_text { display:inline-block; } #admin_aside_contents .volume_mb { display:inline-block; float:right; font-size:90%; } #admin_aside_contents .disk_graph { position:relative; top:-12px; left:0; width:145px; margin:0 auto; padding:0; } #admin_aside_contents .disk_width { position:relative; top:-18px; left:0; width:145px; height:3px; margin:0 auto; padding:0; background-color:#cbcac2; } #admin_aside_contents .disk_width img { position:relative; top:-11px; left:0; height:3px; margin:0; padding:0; } #admin_aside_contents .disk_percent { position:relative; top:-18px; left:0; width:145px; margin:0 auto -10px; padding:0; font-size:95%; } #admin_aside_contents span.percent_50 { padding-left:35px; } #admin_aside_contents span.percent_100 { padding-left:24px; } #admin_aside_contents .left_search_input { width:80px; height:15px; padding:1px; border:1px solid #b7b7b7; color:#444; } #admin_aside_contents .left_search_button { margin-bottom:3px; width:32px; height:18px; vertical-align:middle; } #admin_main_wrap { margin:0; padding:10px; } #admin_main_wrap h3 { margin-bottom:5px; padding-left:15px; background:url('../wp_default_image/icon_gray_arrow.gif') no-repeat 0 5px; font-weight:bold; color:#666; } #admin_main_left { float:left; width:49%; } #admin_main_space { float:left; width:2%; } #admin_main_right { float:right; width:49%; } #admin_webplus_frame { width:100%; height:220px; margin:0; padding:0; border:0 solid transparent; } .admin_main_table { width:100%; border:4px solid #e6e6e6; border-collapse:collapse; } .admin_main_table caption { overflow:hidden; width:0; height:0; font-size:0; line-height:0; } .admin_main_table th { margin:0; padding:5px 0; border:1px #ccc solid; border-bottom:2px solid #ccc; background-color:#ffffc1; font-weight:lighter; color:#124e86; } .admin_main_table tbody { text-align:center; } .admin_main_table tbody td { padding:5px; border:1px #ccc solid; } .admin_main_table tbody td img { vertical-align:middle; } .admin_main_table tbody .td_left { text-align:left; } .admin_gallery_list { overflow:hidden; margin:0; padding:0; } .admin_gallery_list li { display:inline; float:left; margin:0 10px 0 0; padding-bottom:10px; text-align:center; } .admin_gallery_list li img { vertical-align:middle; } .admin_gallery_list .gallery_image { display:block; margin:0; padding:0; } .admin_gallery_list .gallery_subject { display:block; margin:0; padding-top:5px; } .admin_gallery_list .gallery_ref { color:#555; } #admin_footer_wrap { margin-left:200px; padding:10px 0; border-top:1px solid #adadad; text-align:center; } #admin_position .home_buttom { display:inline-block; margin:0; padding-right:5px; font-weight:normal; } #admin_position .title { display:inline-block; margin:0; padding-left:10px; border-left:3px solid #999; font-size:120%; font-weight:bold; color:#444; } #admin_position .sub_menu { display:inline-block; margin:0; padding:0; } #admin_position .etc_menu { display:inline-block; float:right; margin:0; padding:0; } #admin_document { clear:both; margin:15px 0; padding:0; table-layout:fixed; } #admin_sub_iframe { width:100%; height:1000px; margin:0; padding:0; border:0 solid transparent; } #admin_sub_search { margin-bottom:15px; padding:0; border:2px #b0a9a8 solid; background-color:#ccc; } #admin_sub_search h3 { margin:0; padding:5px 5px 5px 30px; border-bottom:2px #ccc solid; background:url('../wp_default_image/tip_search.gif') no-repeat 5px 7px; background-color:#dbdbdb; font-weight:bold; } #admin_sub_search fieldset { margin:0; padding:0; } #admin_sub_search span { font-weight:lighter; } #admin_sub_search ul { margin:0; padding:10px; background-color:#fff; } #admin_sub_search li { margin:0; padding:3px 0; list-style:none; } #admin_sub_search img { vertical-align:middle; } #admin_sub_search .search_button { vertical-align:middle; } /******************************************************************************/ /** 개발자가 개발범위에 맞는 Class 및 ID 값을 새롭게 정의한다.(네이밍 수정불가) **/ /******************************************************************************/ /* Body */ #popup_body { margin:0; padding:0; } #main_body { margin:0; padding:0; font-size:1.1em; font-family:Noto Sans KR, dotum, 돋움, Helvetica, sans-serif; font-weight:300; color:#333; line-height:1.7em; } #main_body strong { font-weight:500; } #main_body ul { list-style:none; } #sub_body { margin:0; padding:0; font-size:1.1em; font-family:Noto Sans KR, dotum, 돋움, Helvetica, sans-serif; font-weight:300; color:#333; line-height:1.7em; } #sub_body strong { font-weight:500; } #sub_body ul { list-style:none; } /* 메인화면 레이아웃 */ #main_wrap { margin:0; padding:0; } #main_header { margin:0; padding:0; } #main_section { margin:0; padding:0; } #main_footer { clear:both; margin:0; padding:0; } /* 서브화면 레이아웃 */ #sub_wrap { margin:0; padding:0; } #sub_header { margin:0; padding:0; } #sub_container { margin:0; padding:0; } #sub_footer { clear:both; margin:0; padding:0; border-top:1px solid #bfbfbf; } /* 상단영역 콘텐츠 */ #mobile_top_contents { display:none; } #top_contents { position:fixed; top:0; left:0; z-index:1000; width:100%; transition:0.5s; } #top_contents.scroll { background-color:#fff; transition:0.5s; } #top_contents #top_division { overflow:hidden; width:1200px; margin:0 auto; padding:70px 0 80px; } #top_contents.scroll #top_division { padding:30px 0 10px; } #top_contents #top_logo { float:left; margin-top:10px; } #top_contents #top_logo a { display:block; width:321px; height:70px; background:url('../wp_images/logo.png') no-repeat 0 0; text-indent:-9999px; } #top_contents #top_nav { float:right; } #top_contents #top_nav ul { overflow:hidden; margin:0; padding:0; list-style:none; } #top_contents #top_nav ul li { float:left; margin-left:50px; } #top_contents #top_nav ul li a { display:block; padding-top:25px; font-size:125%; font-weight:400; color:#000; } #top_contents #top_nav ul li:hover a { background:url('../wp_images/main_menu_on.png') no-repeat center top; } #sub_body #top_contents.scroll_sub { background-color:rgba(0,0,0,0.7); transition:0.5s; } #sub_body #top_contents.scroll_sub #top_division { padding:30px 0 10px; transition:0.5s; } #sub_body #top_contents #top_logo a { background:url('../wp_images/logo_white.png') no-repeat 0 0; } #sub_body #top_contents #top_nav ul li a { color:#fff; } #sub_body #top_contents #top_nav ul li:hover a { background:url('../wp_images/main_menu_on-white.png') no-repeat center top; } #sub_body #top_contents #top_nav ul li.on a { background:url('../wp_images/main_menu_on-white.png') no-repeat center top; } /* 하단영역 콘텐츠 */ #mobile_bottom_contents { display:none; } #bottom_contents { overflow:hidden; position:relative; width:1200px; margin:0 auto; padding:55px 0 55px 240px; box-sizing:border-box; } #bottom_contents #bottom_logo { position:absolute; left:0; top:55px; margin:0; padding:0; } #bottom_contents #bottom_address { margin:0 0 10px; padding:0; font-size:85%; font-weight:400; } #bottom_contents #bottom_address strong { padding-right:5px; } #bottom_contents #bottom_address span { padding:0 15px; font-size:80%; color:#666; } #bottom_contents #bottom_copyright { margin:0; padding:0; font-size:85%; } #bottom_contents .bottom_sns { display:block; position:absolute; right:0; top:calc(50% - 27px); width:55px; height:55px; background:url('../wp_images/b_sns.png') no-repeat center center; text-indent:-9999px; box-sizing:border-box; } #bottom_contents .bottom_sns.blog { right:80px; background:url('../wp_images/b_sns_blog.png') no-repeat center center; } /* 메인화면 콘텐츠 */ #main_aside { position:fixed; top:200px; right:-480px; z-index:1000; transition:1s; } #main_aside.show { right:0; transition:1s; } #main_aside .aside_open_btn.animation_stop { animation:none; background-image:url('../wp_images/aside_close.gif'); } #main_aside .aside_open_btn { display:block; position:absolute; left:-60px; top:0; width:60px; height:200px; background:#8d5944 url('../wp_images/aside_open.gif') no-repeat center right; text-indent:-9999px; animation:aside_btn_swing 1s alternate infinite forwards; } #main_aside .aside_product { width:480px; border:1px solid #8d5944; background:#fff url('../wp_images/aside_bg.gif') no-repeat top right; } #main_aside .aside_product ul { overflow:hidden; margin:0; padding:30px 30px 10px; list-style:none; } #main_aside .aside_product ul li { float:left; width:50%; margin-bottom:20px; text-align:center; } #main_aside .aside_product ul li img { display:block; margin:0 auto 5px; } #main_aside .aside_product ul li strong { font-size:85%; } #main_aside .bottom { display:block; position:relative; width:100%; height:75px; padding:10px 0 0 210px; background:#8d5944 url('../wp_images/aside_btn_bg.gif') no-repeat 90% center; box-sizing:border-box; } #main_aside .naver_btn { display:block; position:absolute; left:20px; bottom:10px; width:55px; height:55px; background:url('../wp_images/b_sns_naver.png') no-repeat center center; text-indent:-9999px; box-sizing:border-box; } #main_aside .insta_btn { display:block; position:absolute; left:87px; bottom:10px; width:55px; height:55px; background:url('../wp_images/b_sns.png') no-repeat center center; text-indent:-9999px; box-sizing:border-box; } #main_aside .kakao_btn { display:block; position:absolute; left:153px; bottom:10px; width:55px; height:55px; background:url('../wp_images/b_sns_kakao.png') no-repeat center center; text-indent:-9999px; box-sizing:border-box; } #main_aside .bottom p { margin:0; padding:0; font-size:90%; font-weight:400; text-align:center; color:#fff; } #main_aside .bottom p strong { display:block; font-size:130%; background:url('../wp_images/b_sns_tel.gif') no-repeat 30px center; } @keyframes aside_btn_swing { 0% { top:0; } 100% { top:15px; } } #main_section .main_visual .swiper-container { width:100%; height:100%; } #main_section .main_visual .swiper-slide { width:100%; height:100%; } #main_section .main_visual .swiper-slide p { position:absolute; left:18%; top:45%; font-size:220%; line-height:150%; } #main_section .main_visual .visual_01 { position:relative; width:100%; height:100%; background-color:#eed6bc; } #main_section .main_visual .visual01_img { position:absolute; right:10%; bottom:2%; } #main_section .main_visual .swiper-slide-active .visual01_img { animation:ani_visual01_img 3s forwards; } #main_section .main_visual .visual_01 p span { display:inline-block; position:relative; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(1) { opacity:0; animation:ani_visual01_text 0.3s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(2) { opacity:0; animation:ani_visual01_text 0.3s 0.2s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(3) { opacity:0; animation:ani_visual01_text 0.3s 0.5s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(4) { opacity:0; animation:ani_visual01_text 0.3s 0.7s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(5) { opacity:0; animation:ani_visual01_text 0.3s 0.9s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(6) { opacity:0; animation:ani_visual01_text 0.3s 1.2s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(7) { opacity:0; animation:ani_visual01_text 0.3s 1.4s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(8) { opacity:0; animation:ani_visual01_text 0.3s 1.6s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(9) { opacity:0; animation:ani_visual01_text 0.3s 1.8s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(10) { opacity:0; animation:ani_visual01_text 0.3s 2.0s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(11) { opacity:0; animation:ani_visual01_text 0.3s 2.3s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(12) { opacity:0; animation:ani_visual01_text 0.3s 2.6s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(13) { opacity:0; animation:ani_visual01_text 0.3s 3.0s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(14) { opacity:0; animation:ani_visual01_text 0.3s 3.5s forwards; } #main_section .main_visual .swiper-slide-active .visual_01 p span:nth-of-type(15) { opacity:0; animation:ani_visual01_text 0.3s 4.0s forwards; } @keyframes ani_visual01_text { 0% { opacity:0; top:-10px; } 100% { opacity:1; top:0; } } @keyframes ani_visual01_img { 0% { opacity:0; right:8%; bottom:4%; } 100% { opacity:1; right:10%; bottom:2%; } } #main_section .main_visual .swiper-slide .visual_02 { position:relative; width:100%; height:100%; background:url('../wp_images/m_visual_02-bg.jpg') no-repeat center center; } #main_section .main_visual .swiper-slide-active .visual_02 { animation:ani_visual02_bg 4s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(1) { opacity:0; animation:ani_visual02_text 0.3s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(2) { opacity:0; animation:ani_visual02_text 0.3s 0.2s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(3) { opacity:0; animation:ani_visual02_text 0.3s 0.3s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(4) { opacity:0; animation:ani_visual02_text 0.3s 0.4s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(5) { opacity:0; animation:ani_visual02_text 0.3s 0.5s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(6) { opacity:0; animation:ani_visual02_text 0.3s 0.6s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(7) { opacity:0; animation:ani_visual02_text 0.3s 0.7s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(8) { opacity:0; animation:ani_visual02_text 0.3s 0.8s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(9) { opacity:0; animation:ani_visual02_text 0.3s 0.9s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(10) { opacity:0; animation:ani_visual02_text 0.3s 1.0s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(11) { opacity:0; animation:ani_visual02_text 0.3s 1.1s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(12) { opacity:0; animation:ani_visual02_text 0.3s 1.2s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(13) { opacity:0; animation:ani_visual02_text 0.3s 1.3s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(14) { opacity:0; animation:ani_visual02_text 0.3s 1.4s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(15) { opacity:0; animation:ani_visual02_text 0.3s 1.5s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(16) { opacity:0; animation:ani_visual02_text 0.3s 1.6s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(17) { opacity:0; animation:ani_visual02_text 0.3s 1.7s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(18) { opacity:0; animation:ani_visual02_text 0.3s 1.8s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(19) { opacity:0; animation:ani_visual02_text 0.3s 2.3s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(20) { opacity:0; animation:ani_visual02_text 0.3s 2.4s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(21) { opacity:0; animation:ani_visual02_text 0.3s 2.5s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(22) { opacity:0; animation:ani_visual02_text 0.3s 2.6s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(23) { opacity:0; animation:ani_visual02_text 0.3s 2.7s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(24) { opacity:0; animation:ani_visual02_text 0.3s 2.8s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(25) { opacity:0; animation:ani_visual02_text 0.3s 2.9s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(26) { opacity:0; animation:ani_visual02_text 0.3s 3.0s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(27) { opacity:0; animation:ani_visual02_text 0.3s 3.1s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(28) { opacity:0; animation:ani_visual02_text 0.3s 3.2s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(29) { opacity:0; animation:ani_visual02_text 0.3s 3.3s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(30) { opacity:0; animation:ani_visual02_text 0.3s 3.4s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(31) { opacity:0; animation:ani_visual02_text 0.3s 3.5s forwards; } #main_section .main_visual .swiper-slide-active .visual_02 p span:nth-of-type(32) { opacity:0; animation:ani_visual02_text 0.3s 3.6s forwards; } @keyframes ani_visual02_text { 0% { opacity:0; left:-10px; } 100% { opacity:1; left:0; } } @keyframes ani_visual02_bg { 0% { background:url('../wp_images/m_visual_02-bg.jpg') no-repeat center bottom; } 100% { background:url('../wp_images/m_visual_02-bg.jpg') no-repeat center top; } } #main_section .main_visual .swiper-slide .visual_03 { position:relative; width:100%; height:100%; background:url('../wp_images/m_visual_03-bg.jpg') no-repeat center bottom; } #main_section .main_visual .swiper-slide-active .visual_03 { animation:ani_visual03_bg 3s forwards; } #main_section .main_visual .swiper-slide .visual_03 p { top:40%; font-size:160%; } #main_section .main_visual .swiper-slide-active .visual_03 p { animation:ani_visual03_text 4s forwards; } @keyframes ani_visual03_bg { 0% { background:url('../wp_images/m_visual_03-bg.jpg') no-repeat center bottom; } 100% { background:url('../wp_images/m_visual_03-bg.jpg') no-repeat center top; } } @keyframes ani_visual03_text { 0% { opacity:0; top:45%; } 100% { opacity:1; top:40%; } } #main_section .section .inner { position:relative; width:1200px; height:100%; margin:0 auto; } #main_section .main_item .item_image { opacity:0; display:block; position:absolute; vertical-align:middle; } #main_section .main_item .item_title { display:block; position:absolute; top:200px; font-size:740%; font-weight:700; color:#eee; } #main_section .main_item .item_title span { display:inline-block; position:relative; } #main_section .main_item .right .item_title { right:0; } #main_section .main_item .left .item_title { left:0; } #main_section .main_item .item_text { display:block; position:absolute; bottom:300px; font-size:110%; color:#000; } #main_section .main_item .right .item_text { right:0; text-align:right; } #main_section .main_item .left .item_text { left:0; } #main_section .main_item .item_more { display:block; position:absolute; bottom:100px; font-size:110%; font-weight:400; color:#000; transition:0.5s; } #main_section .main_item .right .item_more { right:0; padding-right:220px; background:url('../wp_images/m_item_more-1.png') no-repeat 80% center; } #main_section .main_item .right .item_more:hover { background-position:right center; transition:0.5s; } #main_section .main_item .left .item_more { left:0; padding-left:220px; background:url('../wp_images/m_item_more-2.png') no-repeat 20% center; } #main_section .main_item .left .item_more:hover { background-position:left center; transition:0.5s; } @keyframes ani_item_title { 0% { top:-30px; } 100% { opacity:1; top:0; } } #main_section .section .gray_box { position:absolute; z-index:-1; width:48%; height:480px; background-color:#f7f7f7; transition:1s; } #main_section .main_item_01 .gray_box { left:-48%; top:110px; } #main_section .main_item_01.active .gray_box { left:0; transition:1.5s; } #main_section .main_item_01 .item_image { left:0; top:100%; } #main_section .main_item_01.active .item_image { opacity:1; top:280px; transition:1s; transition-delay:0.5s; } #main_section .main_item_01.active .item_title span:nth-of-type(1) { opacity:0; animation:ani_item_title 0.5s 0.4s forwards; } #main_section .main_item_01.active .item_title span:nth-of-type(2) { opacity:0; animation:ani_item_title 0.5s 0.6s forwards; } #main_section .main_item_01.active .item_title span:nth-of-type(3) { opacity:0; animation:ani_item_title 0.5s 0.8s forwards; } #main_section .main_item_01.active .item_title span:nth-of-type(4) { opacity:0; animation:ani_item_title 0.5s 1.0s forwards; } #main_section .main_item_01.active .item_title span:nth-of-type(5) { opacity:0; animation:ani_item_title 0.5s 1.2s forwards; } #main_section .main_item_02 .gray_box { right:-48%; top:110px; transition:0.5s; } #main_section .main_item_02.active .gray_box { right:0; transition:1.5s; } #main_section .main_item_02 .item_image { right:0; top:100%; } #main_section .main_item_02.active .item_image { opacity:1; top:280px; transition:1s; transition-delay:0.5s; } #main_section .main_item_02.active .item_title span:nth-of-type(1) { opacity:0; animation:ani_item_title 0.5s 0.4s forwards; } #main_section .main_item_02.active .item_title span:nth-of-type(2) { opacity:0; animation:ani_item_title 0.5s 0.6s forwards; } #main_section .main_item_02.active .item_title span:nth-of-type(3) { opacity:0; animation:ani_item_title 0.5s 0.8s forwards; } #main_section .main_item_02.active .item_title span:nth-of-type(4) { opacity:0; animation:ani_item_title 0.5s 1.0s forwards; } #main_section .main_item_02.active .item_title span:nth-of-type(5) { opacity:0; animation:ani_item_title 0.5s 1.2s forwards; } #main_section .main_item_02.active .item_title span:nth-of-type(6) { opacity:0; animation:ani_item_title 0.5s 1.4s forwards; } #main_section .main_item_03 .gray_box { left:-48%; top:110px; transition:0.5s; } #main_section .main_item_03.active .gray_box { left:0; transition:1.5s; } #main_section .main_item_03 .item_image { left:0; top:100%; } #main_section .main_item_03.active .item_image { opacity:1; top:280px; transition:1s; transition-delay:0.5s; } #main_section .main_item_03.active .item_title span:nth-of-type(1) { opacity:0; animation:ani_item_title 0.5s 0.4s forwards; } #main_section .main_item_03.active .item_title span:nth-of-type(2) { opacity:0; animation:ani_item_title 0.5s 0.6s forwards; } #main_section .main_item_03.active .item_title span:nth-of-type(3) { opacity:0; animation:ani_item_title 0.5s 0.8s forwards; } #main_section .main_item_03.active .item_title span:nth-of-type(4) { opacity:0; animation:ani_item_title 0.5s 1.0s forwards; } #main_section .main_item_03.active .item_title span:nth-of-type(5) { opacity:0; animation:ani_item_title 0.5s 1.2s forwards; } #main_section .slide_coffee .inner { overflow:hidden; width:1300px; padding-top:180px; box-sizing:border-box; } #main_section .slide_coffee .title { display:block; margin:0 auto 140px; padding:5px 0; font-size:300%; text-align:center; } #main_section .slide_coffee .swiper-slide { position:relative; transform:scale(0.6) translate3d(0, 0, 0); transition:0.5s; text-align:center; } #main_section .slide_coffee .swiper-slide-active { transform:scale(1) translate3d(0, 0, 0); transition:0.5s; } #main_section .slide_coffee .swiper-slide { position:relative; text-align:center; } #main_section .slide_coffee .swiper-slide a { opacity:0; position:absolute; left:calc(50% - 175px); top:0; width:350px; height:350px; padding:120px 20px 0; background-color:rgba(0,0,0,0.8); font-weight:400; font-size:95%; color:#fff; border-radius:450px; box-sizing:border-box; transition:0.5s; } #main_section .slide_coffee .swiper-slide a:hover { opacity:1; transition:0.5s; } #main_section .slide_coffee .swiper-slide a span { display:block; position:absolute; left:calc(50% - 40px); top:calc(50% - 40px); width:80px; height:80px; margin:0 auto; padding:0; text-align:center; line-height:80px; border:1px solid #fff; border-radius:80px; } #main_section .consult { background:url('../wp_images/m_consult_bg.jpg') no-repeat center center; background-size:cover; } #main_section .consult .inner { padding:110px 0 130px; text-align:center; } #main_section .consult p { margin:0 0 110px; padding:5px 0; font-size:230%; font-weight:400; color:#fff; text-shadow:1px 1px 3px rgba(100,100,100,0.5); } #main_section .consult a { display:block; width:540px; margin:0 auto; padding:30px 0; border:1px solid #fff; background:url('../wp_images/m_consult_01.png') no-repeat 90% center; font-size:170%; font-weight:500; color:#fff; text-shadow:1px 1px 3px rgba(100,100,100,0.5); transition:0.5s; } #main_section .consult a:hover { background-position:95% center; transition:0.5s; } /* 서브화면 콘텐츠 */ #sub_visual { height:400px; margin:0; padding:0; background:url('../wp_images/sub_visual_img.jpg') no-repeat center top; box-sizing:border-box; } #sub_nav { position:relative; height:400px; margin:-400px 0 0; padding:270px 0 0; box-sizing:border-box; } #sub_nav h2 { margin:0; padding:0; font-size:240%; font-weight:600; text-align:center; color:#fff; } #sub_nav ul { display:none; margin:0; padding:0; } #sub_nav li { margin:0; padding:0; } #sub_aside { display:none; } #sub_section { margin:0; padding:0; } #sub_position { display:none; margin:0; padding:0; } #sub_position_title { margin:0; padding:0; } #sub_position_text { margin:0; padding:0; } #sub_position_text .position_bull { margin:0; padding:0; } #sub_position_text .position_name { margin:0; padding:0; } #sub_document { width:1200px; margin:0 auto; padding:80px 0; table-layout:fixed; } #sub_document.width_100 { width:100%; padding:80px 0 0; } #sub_data_request { width:700px; height:240px; margin:0 auto; background:url('../wp_default_image/data_request.gif') no-repeat; } #sub_page_preparation { width:700px; height:240px; margin:0 auto; background:url('../wp_default_image/page_preparation.gif') no-repeat; } #sub_page_update { width:700px; height:240px; margin:0 auto; background:url('../wp_default_image/page_update.png') no-repeat; } /*********************************************************************************/ /** 아래 라인부터는 개발자가 필요할 경우 Class 및 ID를 자유롭게 정의하여 사용한다. **/ /** 자주 사용될 수 있는 Class는 관리자 승인 후 공통설정으로 지정하여 사용한다. **/ /*********************************************************************************/ /* 페이지 공용 */ .accessibility_skip_nav a { display:block; overflow:hidden; position:absolute; top:0; left:0; width:100%; height:0; background-color:#676767; color:#fff; text-align:center; } .accessibility_skip_nav a:focus { position:absolute; z-index:9999; width:100%; height:auto; margin:0; padding:10px 0; color:#fff; font-weight:500; } .accessibility_ir { overflow:hidden; position:absolute; left:-10000px; top:auto; height:1px; } .page_view_title { margin:20px 0 5px; padding:0; font-weight:bold; } .page_view_table { width:100%; border:0; border-collapse:collapse; table-layout:fixed; } .page_view_table th { padding:5px 0; border:1px solid #c9c9c9; border-bottom:2px solid #9b9b9b; background-color:#ececec; text-align:center; color:#444; vertical-align:middle; } .page_view_table td { padding:5px; border:1px solid #c9c9c9; text-align:center; vertical-align:middle; word-break:break-all; white-space:normal; } .page_view_table img { vertical-align:middle; } .page_table_basic { width:100%; margin:0 auto 40px; border-top:2px solid #444; border-collapse:collapse; } .page_table_basic.last { margin-bottom:0; } .page_table_basic caption { overflow:hidden; width:0; height:0; font-size:0; line-height:0; } .page_table_basic thead th { padding:6px 5px; border-left:1px solid #ccc; border-bottom:1px solid #ccc; background-color:#eee; font-weight:bold; color:#444; } .page_table_basic thead th:first-child { border-left:none; } .page_table_basic tbody tr th { border-bottom:1px solid #ccc; } .page_table_basic tbody tr td.border_left_none { border-left:none; } .page_table_basic tbody tr td.text_left { padding-left:20px; text-align:left; } .page_table_basic tbody tr td.text_left ul { margin:0; padding-left:20px; } .page_table_basic tbody tr td.text_left ol { margin:0; padding-left:20px; } .page_table_basic tbody tr .bg_gray { background-color:#eee; } .page_table_basic tr td { padding:10px 5px; border-bottom:1px solid #ccc; border-left:1px solid #ccc; text-align:center; word-break:keep-all; } .page_table_basic tr td:first-child { border-left:none; } .page_title_h4 { width:80%; margin:0 auto 60px; padding:0; font-size:200%; font-weight:500; text-align:center; } /* 메인메뉴1 (About) */ @font-face { font-family: 'SeoulHangangM'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/SeoulHangangM.woff') format('woff'); font-weight: normal; font-style: normal; } .page01_01_greeting p { width:1200px; margin:0 auto 100px; font-family:SeoulHangangM; text-align:center; color:#666; line-height:200%; } .page01_01_greeting p .text_bigger { font-size:160%; font-weight:normal; color:#000; } .page01_01_greeting p img { display:block; margin:30px auto; } .page01_01_greeting p .text_big { font-size:130%; color:#000; } .page01_01_greeting .about_bottom { padding:130px 0 120px; background:url('../wp_images/01_01_02.jpg') no-repeat center top; } .page01_01_greeting .about_bottom .title { display:block; width:100%; margin:0 0 70px; font-family:SeoulHangangM; font-size:220%; font-weight:bold; text-align:center; } .page01_01_greeting .about_bottom ul { width:1200px; margin:0 auto; padding:0; } .page01_01_greeting .about_bottom ul li { height:310px; padding:100px 0 0 400px; box-sizing:border-box; } .page01_01_greeting .about_bottom ul li:nth-child(1) { background:url('../wp_images/01_01_03.png') no-repeat left center; } .page01_01_greeting .about_bottom ul li:nth-child(2) { padding:100px 400px 0 0; background:url('../wp_images/01_01_04.png') no-repeat right center; text-align:right; } .page01_01_greeting .about_bottom ul li:nth-child(3) { background:url('../wp_images/01_01_05.png') no-repeat left center; } .page01_01_greeting .about_bottom ul li strong { display:block; margin-bottom:20px; font-size:160%; } .page01_01_greeting .about_bottom ul li span { font-family:SeoulHangangM; font-size:130%; font-weight:normal; } /* 메인메뉴2 (Ruda Coffee) */ .page02_01_list { overflow:hidden; margin:0; padding:0; list-style:none; } .page02_01_list li { float:left; width:33.33%; margin:0 0 60px; text-align:center; } .page02_01_list li:nth-child(7) { margin-bottom:0; } .page02_01_list li:nth-child(8) { margin-bottom:0; } .page02_01_list li img { margin-bottom:30px; vertical-align:middle; } .page02_01_list li p { position:relative; width:300px; height:240px; margin:0 auto; padding:0 15px; color:#666; font-size:85%; word-break:keep-all; box-sizing:border-box; } .page02_01_list li strong { display:block; margin:0 0 20px; font-size:140%; color:#663300; } .page02_01_list li .hash_tag { display:block; position:absolute; left:0; top:180px; width:100%; color:#6493c2; text-align:center; word-spacing:4px; } .page02_01_list li .hash_tag span { display:inline-block; margin:0 3px; } /* 메인메뉴3 (Our service) */ .page03_01_top { overflow:hidden; margin:0 0 200px; padding:0; } .page03_01_top .black { float:left; width:50%; height:470px; background:#221f1f url('../wp_images/03_01_01.jpg') no-repeat center center; } .page03_01_top .text { float:left; position:relative; width:50%; margin:0; padding:280px 0 0 100px; word-break:keep-all; box-sizing:border-box; } .page03_01_top .text::before { content:''; display:block; position:absolute; left:-100px; top:250px; width:300px; height:0; border-top:2px solid #ecd4ba; } .page03_01_top .text strong { display:block; margin-bottom:30px; font-size:160%; color:#4d3919; } .page03_01_text { margin:0 0 100px; font-size:110%; text-align:center; word-break:keep-all; } .page03_01_service { overflow:hidden; margin:0; padding-bottom:550px; background:url('../wp_images/03_01_10.jpg') no-repeat bottom center; list-style:none; } .page03_01_service li { float:left; width:12.5%; } .page03_01_service li .round { display:block; width:85px; height:85px; margin:0 auto 10px; background:#fff url('../wp_images/03_01_02.gif') no-repeat center center; } .page03_01_service li:nth-child(2) .round { background-image:url('../wp_images/03_01_03.gif'); } .page03_01_service li:nth-child(3) .round { background-image:url('../wp_images/03_01_04.gif'); } .page03_01_service li:nth-child(4) .round { background-image:url('../wp_images/03_01_05.gif'); } .page03_01_service li:nth-child(5) .round { background-image:url('../wp_images/03_01_06.gif'); } .page03_01_service li:nth-child(6) .round { background-image:url('../wp_images/03_01_07.gif'); } .page03_01_service li:nth-child(7) .round { background-image:url('../wp_images/03_01_08.gif'); } .page03_01_service li:nth-child(8) .round { background-image:url('../wp_images/03_01_09.gif'); } .page03_01_service li strong { display:block; width:100%; font-size:90%; text-align:center; } /* 메인메뉴4 (Project) */ .page_project_list li { float:left; width:32% !important; margin:0 2% 50px 0; box-sizing:border-box; } .page_project_list li:nth-child(3n) { margin:0 0 50px; } .page_project_list li { border:1px solid #cbcbcb; background-color:#fff6e3; } .page_project_list li:hover { border:1px solid #6a3906; background:#fff6e3 url('../wp_images/04_project_03.gif') no-repeat right center; box-shadow:5px 5px 15px #eee; } .page_project_list li a { display:block; padding:30px 30px 80px; background:url('../wp_images/04_project_01.gif') no-repeat center 95%; transition:0.5s; } .page_project_list li:hover a { background:url('../wp_images/04_project_02.gif') no-repeat center 95%; transition:0.5s; } .page_project_list li .gallery_image { display:block; width:100%; padding-top:60%; margin:0 auto 20px; } .page_project_list li .gallery_subject { font-size:140%; font-weight:500; } /* 메인메뉴5 (Contact) */ .page05_01_contact .map_box { margin-bottom:90px; box-shadow:2px 2px 10px #eaeaea; } .page05_01_contact .info { position:relative; width:100%; padding:35px 0 35px 320px; box-sizing:border-box; } .page05_01_contact .info .logo { position:absolute; left:50px; top:calc(50% - 15px); width:220px; } .page05_01_contact .info p { margin:0; padding:0 0 0 30px; border-left:1px solid #ccc; font-weight:400; } .page05_01_contact .info .address { display:block; margin-bottom:10px; font-size:140%; } .page05_01_contact .info p span { padding:0 10px; } .page05_01_contact .info .map_link { display:block; position:absolute; top:calc(50% - 30px); right:60px; width:62px; height:62px; background:url('../wp_images/page_map_link.gif') no-repeat center center; text-indent:-9999px; } .page_map_title.bus { margin:0 0 30px; padding:22px 0 22px 90px; background:url('../wp_images/page_map_bus.gif') no-repeat left center; font-size:130%; font-weight:500; } .page05_01_contact .page_table_basic { margin:0; padding:0; } .page05_01_contact .page_table_basic tr td { padding:15px 0; border:1px dashed #ccc; } .page05_01_contact .page_table_basic tr td:first-child { background-color:#fffef1; font-weight:400; } .page05_01_contact .page_table_basic .gan { margin-right:10px; padding:0 5px; background-color:#4c8ae8; font-size:80%; color:#fff; } .page05_01_contact .page_table_basic .ji { margin-right:10px; padding:0 5px; background-color:#26b44b; font-size:80%; color:#fff; } /** 반응형웹 스크린 미디어: 개발자가 필요할 경우 정의하여 사용한다. **/ @media (min-width:768px) and (max-width:980px) { #admin_main_menu li a span { width:125px; } } @media (max-width:1700px) { /* 메인화면 콘텐츠 */ #main_section .main_visual .swiper-slide p { left:10%; } @keyframes ani_visual01_img { 0% { opacity:0; right:3%; bottom:4%; } 100% { opacity:1; right:5%; bottom:2%; } } @keyframes ani_visual02_bg { 0% { background:url('../wp_images/m_visual_02-bg.jpg') no-repeat center bottom; } 100% { background:url('../wp_images/m_visual_02-bg.jpg') no-repeat center 18%; } } } @media (max-width:1400px) { /* 메인화면 콘텐츠 */ #main_section .main_visual .swiper-slide p { left:5%; } #main_section .main_visual .swiper-slide .visual_02 p { top:50%; } #main_section .slide_coffee .inner { width:100%; } } @media (max-width:1200px) { /* 상단영역 콘텐츠 */ #top_contents #top_division { width:100%; padding:50px 20px 60px; box-sizing:border-box; } #top_contents.scroll #top_division { padding:30px 20px 10px; } #sub_body #top_contents.scroll_sub #top_division { padding:30px 20px 10px; transition:0.5s; } /* 하단영역 콘텐츠 */ #bottom_contents { width:100%; padding:55px 0 55px 260px; } #bottom_contents #bottom_logo { left:20px; } #bottom_contents .bottom_sns { right:20px; top:70px; } /* 메인화면 콘텐츠 */ #main_section .section .inner { width:100%; } #main_section .main_visual .visual01_img { width:50%; } #main_section .main_item .item_image { width:550px; height:550px; } #main_section .main_item .item_title { font-size:700%; } #main_section .main_item .right .item_title { right:20px; } #main_section .main_item .left .item_title { left:20px; } #main_section .main_item .item_text { bottom:400px; } #main_section .main_item .right .item_text { right:20px; } #main_section .main_item .left .item_text { left:20px; } #main_section .main_item .item_more { bottom:200px; } #main_section .main_item .right .item_more { right:20px; } #main_section .main_item .left .item_more { left:20px; } #main_section .slide_coffee .inner { width:960px; } #main_section .slide_coffee .title { margin:0 auto 120px; font-size:260%; } #main_section .slide_coffee .swiper-slide a { left:calc(50% - 160px); width:320px; height:320px; padding:0; } #main_section .slide_coffee .swiper-slide img { width:320px; height:320px; } #main_section .consult p { font-size:200%; } #main_section .consult a { width:500px; } /* 서브화면 콘텐츠 */ #sub_document { width:100%; padding:80px 5px; box-sizing:border-box; } /* 메인메뉴1 (About) */ .page01_01_greeting p { width:100%; } .page01_01_greeting .about_bottom ul { width:100%; padding:0 10px; box-sizing:border-box; } /* 메인메뉴5 (Contact) */ .page05_01_contact .root_daum_roughmap { width:100% !important; } } @media (max-width:1024px) { #board_input ul { padding:0; border:none; list-style:none; } #board_input li { margin:0; padding:7px 0; } #board_input label { display:block; width:100px; } #board_input .info_span { display:block; font-size:90%; color:#999; } #board_input #writer { width:calc(100% - 26px); } #board_input #phone1 { width:calc(33.33% - 40px); } #board_input #phone2 { width:calc(33.33% - 40px); } #board_input #phone3 { width:calc(33.33% - 40px); } #board_input #email { width:calc(100% - 26px); } #board_input #subject { width:calc(100% - 26px); } /* 상단영역 콘텐츠 */ #top_contents { display:none; } #mobile_top_contents { display:block; position:fixed; top:0; left:0; z-index:1000; width:100%; margin:0; padding:10px 0; background-color:#fff; } #mobile_top_contents ul { list-style:none; } #mobile_top_contents #mobile_top_logo { width:320px; margin:0 auto; padding:0; text-align:center; } #mobile_top_contents #mobile_top_logo a { display:block; } #mobile_top_contents #mobile_top_logo a img { vertical-align:middle; } #mobile_top_contents #mobile_top_tel { left:10px; background:url('../wp_images/mobile_phone.png') no-repeat center center; } #mobile_top_contents #mobile_top_menu { right:10px; background:url('../wp_images/mobile_menu.png') no-repeat center center; } #mobile_top_contents .top_icon { display:block; position:absolute; top:calc(50% - 16px); width:40px; height:32px; margin:0; padding:0; text-indent:-9999px; } #mobile_top_contents #mobile_main_menu { position:fixed; top:0%; right:-100%; z-index:9000; width:100%; height:100%; margin:0; padding:0; background-color:#fff; transition: All 0.4s ease; } #mobile_top_contents #mobile_main_menu a:hover { color:#a2684c; } #mobile_top_contents #mobile_main_menu.open { right:0; } #mobile_top_contents #mobile_main_menu .menu_top { overflow:hidden; height:70px; padding:20px 10px 0; border-bottom:1px solid #eee; box-sizing:border-box; } #mobile_top_contents #mobile_main_menu .menu_home{ float:left; display:block; padding-left:40px; background:url('../wp_images/watermark.png') no-repeat left center; background-size:30px; font-size:120%; font-weight:400; color:#000; line-height:30px; } #mobile_top_contents #mobile_main_menu .menu_close { float:right; width:30px; height:30px; margin-right:20px; background:url('../wp_images/mobile_menu_close.png') no-repeat center center; text-indent:-9999px; box-sizing:border-box; } #mobile_top_contents #mobile_main_menu .menu_list { overflow:scroll; position:absolute; top:70px; z-index:1000; width:100%; height:calc(100% - 160px); margin:0; padding:20px; box-sizing:border-box; } #mobile_top_contents #mobile_main_menu .menu_list li { margin:0; padding:0; box-sizing:border-box; } #mobile_top_contents #mobile_main_menu .menu_list > li > a { display:block; width:100%; margin:0; padding:4% 0 4% 7%; border-bottom:1px solid #ccc; background:#fff url('../wp_images/mobile_menu_off.gif') no-repeat 95% center; font-size:120%; font-weight:400; box-sizing:border-box; } #mobile_top_contents #mobile_main_menu .menu_list > li:first-child > a { border-top:none; } #mobile_top_contents #mobile_main_menu .copyright { position:absolute; bottom:10px; left:0; z-index:100; width:100%; text-align:center; } /* 하단영역 콘텐츠 */ #bottom_contents { display:none; } #mobile_bottom_contents { display:block; overflow:hidden; margin:0; padding:20px 10px 30px; background-color:#eee; font-size:90%; color:#333; } #mobile_bottom_contents #mobile_bottom_menu { display:none; margin:0; padding:0; } #mobile_bottom_contents #mobile_bottom_address { margin-bottom:5px; padding:0; text-align:center; } #mobile_bottom_contents #mobile_bottom_address span { padding:0 5px; } #mobile_bottom_contents #mobile_bottom_copyright { margin:0; padding:0; text-align:center; } #mobile_bottom_contents #mobile_bottom_copyright span a { display:inline-block; width:70%; margin:10px auto 0; padding:5px; border:1px solid #7d7d7d; background-color:#434343; font-size:95%; color:#fff; text-align:center; border-radius:20px; } #mobile_bottom_contents .bottom_top_move { display:none; position:fixed; right:10px; bottom:20px; } /* 메인화면 콘텐츠 */ #main_aside { display:none; } #main_section .main_visual .swiper-slide p { left:30px; font-size:200%; } #main_section .main_visual .swiper-slide-active .visual_01 p { top:30%; } #main_section .main_visual .visual01_img { width:40%; } @keyframes ani_visual01_img { 0% { opacity:0; right:5%; bottom:4%; } 100% { opacity:1; right:3%; bottom:2%; } } #main_section .main_visual .swiper-slide-active .visual_02 p { top:40%; } @keyframes ani_visual02_bg { 0% { background-position:center bottom; } 100% { background-position:center center; } } #main_section .main_visual .swiper-slide .visual_03 { background-size:cover; } #main_section .main_visual .swiper-slide-active .visual_03 { background-size:cover; } #main_section .main_visual .swiper-slide .visual_03 p { font-size:140%; } @keyframes ani_visual03_bg { 0% { transform:scale(1.1); } 100% { transform:scale(1.0); } } #main_section .main_item .item_image { width:400px; height:400px; } #main_section .main_item .item_title { top:20%; font-size:600%; } #main_section .main_item .item_text { bottom:40%; font-size:110%; color:#000; } #main_section .main_item .item_more { bottom:10%; font-size:110%; font-weight:400; color:#000; transition:0.5s; } #main_section .section .gray_box { width:48%; height:50%; } #main_section .main_item_01 .gray_box { top:80px; } #main_section .main_item_01 .item_image { left:40px; top:100%; } #main_section .main_item_01.active .item_image { top:calc(100% - 420px); } #main_section .main_item_02 .item_image { right:40px; top:100%; } #main_section .main_item_02.active .item_image { top:calc(100% - 420px); } #main_section .main_item_03 .item_image { left:40px; top:100%; } #main_section .main_item_03.active .item_image { top:calc(100% - 420px); } #main_section .slide_coffee .inner { width:100%; padding:120px 0; box-sizing:border-box; } #main_section .slide_coffee .title { margin:0 auto 80px; font-size:240%; } #main_section .slide_coffee .swiper-container2 { padding:50px 0 0; } #main_section .slide_coffee .swiper-slide { transform:scale(0.7) translate3d(0, 0, 0); } #main_section .slide_coffee .swiper-slide-active { transform:scale(1) translate3d(0, 0, 0); } #main_section .slide_coffee .swiper-slide a { left:calc(50% - 130px); top:calc(50% - 130px); width:260px; height:260px; padding:90px 0 0; } #main_section .consult p { margin:0 0 90px; font-size:200%; } /* 서브화면 콘텐츠 */ #sub_visual { height:300px; } #sub_nav { height:300px; margin:-300px 0 0; padding:190px 0 0; } /* 메인메뉴1 (About) */ .page01_01_greeting p { padding:0 10px; word-break:keep-all; box-sizing:border-box; } .page01_01_greeting p .text_bigger { font-size:150%; } .page01_01_greeting p .text_big { font-size:120%; } .page01_01_greeting .about_bottom ul li { height:310px; padding:100px 0 0 280px; word-break:keep-all; } .page01_01_greeting .about_bottom ul li:nth-child(1) { background-size:250px; } .page01_01_greeting .about_bottom ul li:nth-child(2) { padding:100px 280px 0 0; background-size:250px; } .page01_01_greeting .about_bottom ul li:nth-child(3) { background-size:250px;} .page01_01_greeting .about_bottom ul li strong { font-size:150%; } .page01_01_greeting .about_bottom ul li span { font-size:120%; } /* 메인메뉴2 (Ruda Coffee) */ .page02_01_list li img { margin:0 auto 40px; } .page02_01_list li p { width:90%; padding:0 5px; } /* 메인메뉴3 (Our service) */ .page03_01_top .black { width:40%; height:400px; background-size:80%; } .page03_01_top .text { width:60%; padding:150px 0 0 30px; } .page03_01_top .text::before { left:-100px; top:100px; } .page03_01_service { padding-bottom:40%; background-size:contain; } .page03_01_service li { width:25%; margin-bottom:40px; } /* 메인메뉴4 (Project) */ .page_project_list li a { padding:15px 15px 80px; } .page_project_list li .gallery_subject { font-size:130%; } /* 메인메뉴5 (Contact) */ .page05_01_contact .info { position:relative; width:100%; padding:30px; box-sizing:border-box; } .page05_01_contact .info .logo { display:block; position:relative; left:0; top:0; margin:0 auto 20px; } .page05_01_contact .info p { padding:0; border:none; text-align:center; } .page05_01_contact .info .map_link { right:30px; } } @media (max-width:768px) { /* 상단영역 콘텐츠 */ #mobile_top_contents #mobile_top_logo { width:260px; } #mobile_top_contents #mobile_top_logo a img { width:100%; } /* 메인화면 콘텐츠 */ #main_section .main_visual .swiper-slide p { left:20px; font-size:160%; } #main_section .main_visual .swiper-slide-active .visual_01 p { top:30%; } #main_section .main_visual .visual01_img { width:70%; } #main_section .main_visual .swiper-slide-active .visual_02 p { left:0; top:50%; width:100%; text-align:center; } @keyframes ani_visual02_bg { 0% { background-position:30% bottom; } 100% { background-position:30% 40%; } } #main_section .main_visual .swiper-slide .visual_03 p { font-size:120%; } #main_section .main_item .item_title { top:140px; font-size:460%; color:#eed8c1; } #main_section .main_item .item_text { bottom:55%; } #main_section .section .gray_box { width:100%; height:200px; } #main_section .main_item_01 .item_image { left:0; } #main_section .main_item_01 .gray_box { top:calc(50% - 100px); } #main_section .main_item_01.active .item_image { top:calc(100% - 400px); } #main_section .main_item_02 .item_image { right:0; } #main_section .main_item_02 .gray_box { top:calc(50% - 100px); } #main_section .main_item_02.active .item_image { top:calc(100% - 400px); } #main_section .main_item_03 .item_image { left:0; } #main_section .main_item_03 .gray_box { top:calc(50% - 100px); } #main_section .main_item_03.active .item_image { top:calc(100% - 400px); } #main_section .slide_coffee .title { margin:0 auto 80px; font-size:200%; } #main_section .slide_coffee .swiper-slide img { width:260px; height:260px; } #main_section .consult p { margin:0 0 80px; font-size:160%; } #main_section .consult a { width:340px; font-size:140%; } /* 서브화면 콘텐츠 */ #sub_visual { height:250px; } #sub_nav { height:250px; margin:-250px 0 0; padding:150px 0 0; } /* 페이지 공용 */ .page_title_h4 { width:100%; background:none; font-size:180%; } /* 메인메뉴1 (About) */ .page01_01_greeting p img { width:300px; } .page01_01_greeting .about_bottom { padding:60px 0; background-size:cover; } .page01_01_greeting .about_bottom .title { font-size:180%; } .page01_01_greeting .about_bottom ul li { height:inherit; margin:0 0 40px; padding:220px 0 0; text-align:center; } .page01_01_greeting .about_bottom ul li:nth-child(1) { background-size:200px; background-position:center top; } .page01_01_greeting .about_bottom ul li:nth-child(2) { padding:220px 0 0; text-align:center; background-size:200px; background-position:center top; } .page01_01_greeting .about_bottom ul li:nth-child(3) { background-size:200px; background-position:center top; } .page01_01_greeting .about_bottom ul li strong { font-size:140%; } .page01_01_greeting .about_bottom ul li span { font-size:110%; } /* 메인메뉴2 (Ruda Coffee) */ .page02_01_list li { float:none; width:100%; margin:0 0 80px; } .page02_01_list li:nth-child(7) { margin-bottom:80px; } .page02_01_list li p { width:100%; height:inherit; font-size:100%; } .page02_01_list li .hash_tag { position:relative; left:0; top:0; } /* 메인메뉴3 (Our service) */ .page03_01_top { margin:0 0 100px; } .page03_01_top .black { float:none; width:400px; height:300px; margin:0 auto 60px; background-size:70%; } .page03_01_top .text { float:none; width:100%; margin:0; padding:0; text-align:center; } .page03_01_top .text::before { left:calc(50% - 150px); top:-30px; } .page03_01_text { font-size:100%; } .page03_01_service { padding-bottom:40%; background-size:contain; } .page03_01_service li { width:50%; } /* 메인메뉴4 (Project) */ .page_project_list li { width:48% !important; margin:0 4% 50px 0; } .page_project_list li:nth-child(2n) { margin:0 0 50px; } .page_project_list li:nth-child(3n) { margin:0 4% 50px 0; } .page_project_list li:nth-child(6n) { margin:0 0 50px; } .page_project_list li a { display:block; padding:20px 20px 80px; } .page_project_list li .gallery_subject { font-size:130%; } /* 메인메뉴5 (Contact) */ .page05_01_contact .root_daum_roughmap .wrap_map { height:350px !important; } .page05_01_contact .info { position:relative; width:100%; padding:30px 10px; box-sizing:border-box; } .page05_01_contact .info .address { font-size:120%; } .page05_01_contact .info .map_link { top:10px; right:10px; } } @media (max-width:480px) { #board_bottom .left_search { width:60px; } #board_bottom .center_paging { width:calc(100% - 120px); } #board_bottom .right_button { width:60px; } /* 상단영역 콘텐츠 */ #mobile_top_contents #mobile_top_logo { width:240px; padding:5px 0; } /* 메인화면 콘텐츠 */ #main_section .main_visual .swiper-slide p { left:10px; font-size:130%; } #main_section .main_item .item_image { width:300px; height:300px; } #main_section .main_item .gray_box { height:220px; } #main_section .main_item .item_title { top:140px; font-size:360%; color:#eed8c1; } #main_section .main_item .item_text { bottom:55%; } #main_section .main_item .item_more { bottom:48%; } #main_section .main_item_01 .gray_box { top:calc(50% - 120px); } #main_section .main_item_01.active .item_image { top:calc(100% - 300px); } #main_section .main_item_02 .gray_box { top:calc(50% - 120px); } #main_section .main_item_02.active .item_image { top:calc(100% - 300px); } #main_section .main_item_03 .gray_box { top:calc(50% - 120px); } #main_section .main_item_03.active .item_image { top:calc(100% - 300px); } #main_section .slide_coffee .title { margin:0 auto 80px; font-size:180%; } #main_section .slide_coffee .swiper-slide img { width:190px; height:190px; } #main_section .slide_coffee .swiper-slide a { left:calc(50% - 80px); top:calc(50% - 80px); width:160px; height:160px; padding-top:45px; } #main_section .consult p { margin:0 0 60px; font-size:150%; word-break:keep-all; } #main_section .consult a { width:320px; padding:15px 0; font-size:130%; } /* 메인메뉴3 (Our service) */ .page03_01_top .black { width:100%; height:0; padding-top:60%; } /* 메인메뉴4 (Project) */ .page_project_list li { float:none; display:block; width:100% !important; margin:0 0 50px; } .page_project_list li:nth-child(3n) { margin:0 0 50px; } .page_project_list li .gallery_subject { font-size:120%; } /* 메인메뉴5 (Contact) */ .page05_01_contact .info { position:relative; width:100%; padding:30px 10px; box-sizing:border-box; } .page05_01_contact .info p { margin:0 0 20px; } .page05_01_contact .info p span { display:block; height:5px; padding:0; font-size:0; text-indent:-9999px; } .page05_01_contact .info .address { font-size:105%; } .page05_01_contact .info .map_link { position:relative; top:0; right:0; width:200px; height:40px; margin:0 auto; background-color:#04ce5c; background-image:none; text-indent:0; font-size:120%; font-weight:400; color:#fff; text-align:center; line-height:40px; border-radius:10px; } } @media (max-width:375px) { /* 상단영역 콘텐츠 */ #mobile_top_contents #mobile_top_logo { width:200px; padding:5px 0; } /* 메인화면 콘텐츠 */ #main_section .main_visual .swiper-slide p { left:10px; font-size:130%; } #main_section .main_item .item_title { top:100px; font-size:340%; color:#eed8c1; } #main_section .main_item .item_text { font-size:105%; word-break:keep-all; } #main_section .slide_coffee .title { margin:0 auto 80px; font-size:180%; } #main_section .slide_coffee .swiper-slide img { width:190px; height:190px; } #main_section .slide_coffee .swiper-slide a { left:calc(50% - 80px); top:calc(50% - 80px); width:160px; height:160px; padding-top:45px; } }