@charset "utf-8";

.pc { display:none !important; }
.mo { display:inherit !important; }

/* header */
header { position:fixed; top:0; width:100%; min-width:100%; height:50px; z-index:999; }

header .header { width:100%; height:50px; margin:0 auto; border-bottom:1px solid #ddd; }
header .header h1 { padding-top:10px; text-align:center; }
header .header h1 a { display:inline-block; width:90px; height:30px; background-size:contain; background-position:50% 50%; }

header .header .hamberger { position:absolute; top:14px; left:14px; display:inline-block; width:22px; height:22px; cursor:pointer; background:url(/images/common/ico_menu.png) 50% 50% no-repeat; background-size:contain; }
header .header .youtube { position:absolute; top:14px; right:14px; display:inline-block; width:30px; height:22px; cursor:pointer; background:url(/images/common/ico_youtube_upload.png) 50% 50% no-repeat; background-size:contain; }

header .gnb { position:fixed; top:50px; left:0; width:100%; min-width:100%; text-align:center; background:#0084d5; display:none; border-bottom:0; }
header .gnb nav { width:100%; height:auto; }
header .gnb nav>ul { width:100%; }
header .gnb nav>ul:after { content:''; display:block; clear:both; }
header .gnb nav>ul>li { position:relative; float:none; width:100%; height:auto; padding:10px; box-sizing:border-box; text-align:left; border-bottom:1px solid #015f9a; background-color:#0084d5; }
header .gnb nav>ul>li .depth1 { position:relative; font-size:16px; font-weight:300; color:#fff; }
header .gnb nav>ul>li span.btn { position:absolute; top:15px; right:10px; width:10px; height:5px; background:url(/images/common/ico_arrow_down.png) no-repeat; background-size:cover; }
header .gnb nav>ul>li:hover { background:#0084d5; }
header .gnb nav>ul>li:hover > .depth1 { color:#fff; }
header .gnb nav>ul>li ul { display:none; position:relative; width:100%; padding:15px 0 0 0; background:none; border:0; border-top:0; }
header .gnb nav>ul>li ul li { height:auto; padding:5px 10px 7px 10px; font-size:14px; display:inline-block; margin-bottom:5px; border-radius:10px; background-color:#0084d5; }
header .gnb nav>ul>li ul li a { color:#eee; }

header .gnb nav>ul>li.open { background:#fff; }
header .gnb nav>ul>li.open span.btn { background:url(/images/common/ico_arrow_up.png) no-repeat; background-size:cover; }
header .gnb nav>ul>li.open .depth1 { font-weight:400; }
header .gnb nav>ul>li.open:hover > .depth1 { color:#0084d5; }

header .gnb .util { padding:10px; }
header .gnb .util ul li { height:auto; padding:8px 20px 10px 20px; font-size:18px; display: inline-block; margin:5px; border-radius:5px; background-color:#fff; }
header .gnb .util ul li a { color: #0084d5; }


/* footer */
footer { min-width:100%; }
footer .footer { width:100%; min-width:100%; height:70px; text-align:center; }
footer .footer .logo { display:none; }
footer .footer .footer-in { float:left; padding-top:15px; width:100%; text-align:center; }
footer .footer .footer-menu { display:inline-block; float:none; margin:0 auto; }
footer .footer .footer-menu li { margin-left:10px; padding-left:10px; }
footer .footer .footer-menu li a { font-size:12px; }
footer .footer .family-site { display:none; }
footer .footer .copyright { float:none; padding-top:10px; font-size:11px; }

/* content wrap */
.wrap { text-align:center; padding:50px 0 20px 0; }
.wrap .container { width:100%; }

/* content wrap */
.content { float:left; position:relative; width:100%; }

/* lnb */
.lnb { display:none; }

.btn-box { width:100%; text-align:center; padding:30px 0; }
.btn-box a { padding:0 15px; margin:0 5px; display:inline-block; border-radius:3px; background-color:#0084d5; color:#fff; font-size:16px; line-height:40px; text-align:center; }
.btn-box a.good { padding-left:40px; background:#0084d5 url(/images/common/ico_good.png) no-repeat 15% 50%; }
.btn-box a.bad { padding-right:40px; background:#0084d5 url(/images/common/ico_bad.png) no-repeat 85% 50%; }

.data-view { width:100%; margin-top:40px; }
.data-view .txt img { max-width:100%; }

.data-reply { width:100%; margin-bottom:50px; box-sizing:border-box; }
.data-reply input[type=text] { width:100%; }
.data-reply textarea { width:100%; height:60px; box-sizing:border-box; }
.data-reply a.btn { float:none; display:inline-block; margin-top:5px; box-sizing:border-box; width:100%; height:34px; line-height:34px; padding:0 15px; text-align:center; }

.data-edit { width:100%; margin-top:40px; }
.data-edit li { padding:10px; box-sizing:border-box; }
.data-edit li div.item { padding:0; }
.data-edit label.tit { position:relative; width:100%; margin-bottom:5px; padding-left:0; }
.data-edit li span.txt { width:100%; padding:10px; box-sizing:border-box; }

.data-edit input[type=text],
.data-edit input[type=password],
.data-edit select,
.data-edit textarea { width:100%; box-sizing:border-box; }
.data-edit textarea { height:150px; }
.data-edit input.w600 { width:100% !important; }
.data-edit input#yt_url { width:inherit; }

.data-edit a.btn { display:inline-block; height:34px; padding:0 15px; border:0; border-radius:2px; background:#0084d5; color:#fff; font-size:14px; line-height:34px; vertical-align:middle; text-align:center; width:100%; box-sizing:border-box; margin-top:5px; }
.data-edit .help { position:absolute; top:18px; right:10px; }
.data-edit .file-info { width:100%; font-size:14px; }
.data-edit .file-box { position:relative; display:inline-block; box-sizing:border-box; width:100%; font-size:14px; padding-right:94px; }
.data-edit .file-box input[type=file] { width:100%; height:34px; }
.data-edit .file-box .btn { position:absolute; margin-top:-32px; right:0; font-size:14px; display:inline-block; width:60px; height:32px; line-height:32px; text-align:center; vertical-align:middle; }
.data-edit .file-box.face { position:relative; margin:0; }
.data-edit .file-box.face .btn { right:0; }
/*
.data-edit .file-box { width:100%; font-size:14px; }
.data-edit .file-box input[type=text] { display:none; }
.data-edit .file-box input[type=file] { position:relative; opacity:1; box-sizing:border-box; width:100%; height:34px; font-size:14px; background:#ccc; border:none; color:#444; vertical-align:middle; padding:5px; }
.data-edit .file-box .btn { display:none; }
*/

.data-table { margin-top:40px; border-top:2px solid #444; }
.data-table table colgroup { display:none; }
.data-table table thead { display:none; }
.data-table table tbody td { height:auto; padding:15px 10px; }
.data-table table tbody td div { padding-top:10px; font-size:12px; color:#999; }
.data-table table tbody td div span { color:#015f9a; }
.data-table table tbody td div span.tab { display:inline-block; width:1px; height:10px; margin:0 8px; background-color:#ccc; }
.data-table .write input { width:100%; box-sizing:border-box; }
.data-table .write a.btn { float:none; margin-top:5px; box-sizing:border-box; width:100%; text-align:center; }

.data-photo { display:inline-block; width:100%; height:auto; text-align:center;}
.data-photo ul li { width:50%; height:100%; margin:0; padding-bottom:20px; text-align:center; font-size:14px; line-height:18px; color:#ccc; box-sizing:border-box; }
.data-photo ul li:nth-child(2n) { margin-right:0; }
.data-photo ul li img { width:90%; height:auto; }
.data-photo ul li .sub { display:inline-block; width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin:5px 0; }
.data-photo ul li .date { margin:0 5px; color:#999; font-weight:300; font-size:12px; }
.data-photo ul li.on img { border:4px solid #0084d5; }

.data-youtube { display:inline-block; width:100%; height:auto; text-align:center; }
.data-youtube ul { margin:5px; }
.data-youtube ul li { width:50%; height:100%; margin:0 0 30px 0; padding:0 5px 15px 5px; border:0; text-align:center; line-height:18px; box-sizing:border-box; }
.data-youtube ul.ch li .btn { margin-top:15px; }

.data-table table tbody td.subject { overflow:unset; }
.data-table table tbody td.subject-m { text-align:left; padding-left:10px; }

.sub-tit { margin-bottom:0; }

.scrolling { margin-left:10px; margin-right:10px; }

.list-info-wrap { height:auto; }
.list-info-wrap .list-search { position:relative; box-sizing:border-box; width:100%; padding:0 5px; }
.list-info-wrap .list-search select,
.list-info-wrap .list-search input,
.list-info-wrap .list-search a { width:100%; box-sizing:border-box; margin-bottom:5px; }
.list-info-wrap .list-btn { position:relative; margin:15px 0; }

.tab-box { padding:0 10px; margin-top:20px; }
.tab-box.x4 ul li { width:50%; box-sizing:border-box; border-top:1px solid #ccc; border-right:1px solid #ccc; }
.tab-box.x4 ul li:nth-child(2n) { border-right:0; }
.tab-box.x4 ul li:nth-child(-n+2) { border-top:0; }
.tab-box + .data-edit { margin-top:0; }

.youtube_popup {
	position:fixed;
	left:0;
	top:50%;
	display:inline-block;
	width:100%;
	margin-left:0;
	margin-top:-25%;
	box-sizing:border-box;
}

.youtube-box::after { content:''; display:inline-block; position:absolute; top:50%; left:50%; margin-top:-15%; margin-left:-15%; width:30%; padding-bottom:30%; border-radius:100%; opacity:0.7; background:url(/images/common/ico_youtube.png) no-repeat 50% 50%; }

#youtube_player { position:relative; width:100%; height:100%; padding-bottom:56.25%; }
#youtube_player iframe { position:absolute; width:100%; height:100%; }

.data-youtube .youtube_popup { width:90%; }

input#yt_url { width:100%; }

.youtube_preview { width:100%; min-height:auto; height:0; padding-bottom:56.25%; }

.main_visual { height:auto; display:block; }
.main_visual .slide { float:none; position:relative; width:100%; height:0; padding-bottom:56.25%; }
.main_visual .rank { float:none; width:100%; height:40px; overflow:hidden; }
.main_visual .rank li { box-sizing:border-box; }
.main_visual .rank li .subject { width:100%; }

/* instargram */
.sns-box .sns-list li { width:44%; margin-top:4%; margin-left:4%; }