/* =======================================================
*
* 	Template Style 
*
* ======================================================= */



@media screen and (max-width: 1024px) {
#nav{width: 100%;position: static;margin: 0;}
}


@media screen and (max-width: 768px) {

body {font-size: 15px;line-height:1.5;}

#wrapper {top:3.2em;padding:10px 0 0;}
#main {position:relative;top:0;margin:-25px auto !important;padding:0 !important;border:none;}
#main_content {float:none;width:92%;overflow:hidden;margin:30px auto!important;}
#sidebar {float:none;width:92%;margin:0 auto!important;overflow:hidden;}
.container {width:100%; margin-right: auto;margin-left: auto;padding-left:0;padding-right:0;}
.row {margin-left:0;margin-right:0;}
.top_section {clear:both;overflow:hidden;padding:2em 0;margin:0 !important;}

.pc_only {display: none;}
.sp_only {display: block;}


/* =======================================================
*
* 	Header
*
* ======================================================= */

#headlink {padding:5px 0 0;}
#headlink span {font-style:italic;font-size:11px;line-height:1em;letter-spacing:1px;}
#headlink #toSUsite {display:none;}

#logo {font-size: 30px;margin:0.15em 0 0 0;padding: 0;font-weight: 700;line-height: 1em;text-align:center;font-family:'Montserrat', sans-serif;letter-spacing:1px;}
#logo img {width:60%;margin:0 auto;} 
#h_snslink {overflow:hidden;position:absolute;top:85px;left:50%;margin-left:-140px;width:280px;}


/* =======================================================
*
* 	navigation
*
* ======================================================= */

#nav{position:absolute;top:0;left:0;}
#nav > a{width:3.425em;height: 3.425em;text-align:left;text-indent: -9999px;background-color: #1a1a1a;position: relative;}
#nav > a:before,
#nav > a:after{position: absolute;border: 2px solid #fff;top:35%;left: 25%;right: 25%;content: '';}
#nav > a:after{top: 60%;}
#nav:not( :target ) > a:first-of-type,
#nav:target > a:last-of-type{display: block;}

/* first level */
#nav > ul{height: auto;display: none;position: absolute;left: 0;right:220px;background-color:rgba(26,26,26,1);z-index:9999;}
#nav:target > ul {display: block;}
#nav > ul > li {width: 100%;float: none;}
#nav > ul > li > a {height: auto;text-align: left;padding: 0.85em 1em;color:#FFF;}
#nav > ul > li:not( :last-child ) > a {border-right: none;border-bottom: 1px solid #666;}
#nav ul li:last-child img {width:80%;}


/* =======================================================
*
* 	contents
*
* ======================================================= */

#metaslider_13 ul.slides {display:none;}
#banner300 {display:none;}


#newtopics {overflow:hidden;margin:0 0 20px;width:100%;padding:0;}
#newtopics ul li {float:none;margin-top:0 !important;margin-bottom:8px !important;padding: 0 0 8px !important;border-bottom:solid 1px #ccc;}
#newtopics ul li:first-child {border-bottom:none;padding-bottom:0;}
#newtopics ul li:nth-child(2),
#newtopics ul li:nth-child(3),
#newtopics ul li:nth-child(4) {width:90%;margin-right:15px;margin-left:15px;}
#newtopics ul li:last-child {margin-right:0;}
#newtopics ul li .newtopicData {width:76%;margin:-50px auto 10px;padding:30px;position:relative;z-index:150;background:#FFF;}
#newtopics ul li .newtopicData p {font-size:18px;margin:10px 0 0;}
#newtopics ul li .topicImg {height:4.5em;width:30%;float:left;margin-right:15px;margin-bottom:0 0 10px;}
#newtopics ul li .topicImg_first {height:19em;margin-bottom:0;}

span.cate,span.date {display:inline-block !important;font-size:13px;font-weight:700;}

#feature {position: relative;margin:-40px 0 0;}
#feature ul {width:86%;margin:0 auto;}
#feature ul li {overflow:hidden;padding: 0 0 5px;font-size:14px;line-height:1.3;}
#feature .slick-prev{left:-8px;top:40%;}
#feature .slick-next{right:-3px;top:40%;}
#feature .slick-slide{margin:0;}

#student {}
#student ul {overflow:hidden;}
#student ul li {float:left;width:33.33333%;padding: 0 0 5px;font-size:14px;line-height:1.3;text-align:center;}
#student ul li:nth-child(4),#student ul li:nth-child(5) {display:none;}
#student ul li .topicImg {height:190px;}
#student ul li span, #student ul li p {margin-right:15px;margin-left:15px;text-align:center !important;}
#student ul li span.studentname {display:block;font-weight:700;font-size:12px;color:#1a1a1a;margin:0 0 5px;font-family:'Montserrat', sans-serif;}


#food {}
#food ul {overflow:hidden;width:94%;position:relative;left:0;margin-left:auto;margin-right:auto;}
#food ul li {float:left;width:44.8%;margin:0 8px 10px;text-align:center;}
#food ul li .circleImg {border-radius:50%;height:155px;}
#food ul li .circleImg {
-moz-transition: -moz-transform 0.5s linear;
    -webkit-transition: -webkit-transform 0.5s linear;
    -o-transition: -o-transform 0.5s linear;
    -ms-transition: -ms-transform 0.5s linear;
    transition: transform 0.5s linear;
}
#food ul li a:hover .circleImg {
-webkit-transform: scale(0.95);
    -moz-transform: scale(0.95);
    -o-transform: scale(0.95);
    -ms-transform: scale(0.95);
    transform: scale(0.95);
}


#event {}
#event ul li {float:none;margin-top:0 !important;margin-bottom:8px !important;padding: 0 0 8px !important;border-bottom:solid 1px #ccc;width:90%;margin-right:15px;margin-left:15px;display:block;overflow:hidden;}
#event ul li .newtopicData {width:80%;margin:-50px auto 10px;padding:30px;position:relative;z-index:150;background:#FFF;}
#event ul li .newtopicData p {font-size:18px;margin:10px 0 0;}
#event ul li .topicImg {height:7em;width:30%;float:left;margin-right:15px;margin-bottom:0;}
#event ul li .topicImg_first {height:20em;margin-bottom:0;}

#sb_instagram {height:100px;}

#instagram #sbi_images {}
#sb_instagram.sbi_col_5 {height:485px !important;overflow:hidden;}
#sb_instagram.sbi_col_5 #sbi_images .sbi_item {width:49.8%;height:160px !important;}
#sb_instagram.sbi_col_5 #sbi_images .sbi_item a {height:150px !important;}


/* =======================================================
*
* 	Footer
*
* ======================================================= */

#footer {clear:both;position:relative;margin-top:2em; padding:1em 0 6.5em 0;width:100%;border-top:solid 1px #1a1a1a;text-align:center;}
#f_snslink {overflow:hidden;left:50%;margin-left:-140px;width:280px;}

#f_fixbanner {display:inline-block;position:fixed;z-index:200;bottom:0;right:0;width:100%;height:auto;padding:0;background-color: rgba(0,0,0,0.85);}
#f_fixbanner #metaslider_20 ul.slides {width:98%;padding:0;margin:6px auto;list-style:none;}
#f_fixbanner #metaslider_20 ul.slides li {}
#f_fixbanner #metaslider_20 ul.slides li img {width:100%;}

/* =======================================================
*
* 	contents
*
* ======================================================= */

table {width:100%;border-right: 1px solid #ccc;}

table th,
table td{width:97%;display: block;border-top: none;}
table th {border-right:none;padding-right:0;}
table tr:first-child th { border-top: 1px solid #ddd;}


#eyecatch_img {margin:0 0 20px;height:280px;max-height:280px;background-repeat:no-repeat;background-size:115% auto;background-position:center center;}
#eyecatch_img img {width:100%;}

#post_content {overflow:hidden;width:100%;}
#post_content h2#cate_title {text-align:center;display:block;border-bottom:dotted 1px #1a1a1a;padding-bottom:5px;margin-bottom:15px !important;}
#post_content .meta {clear:both;overflow:hidden;margin:30px 0 30px;padding:0 0 0;border-top:dotted 1px #555;}
#post_content .meta ul li a {font-size:14px;}
#post_content .movie {width:100%;height:180px;margin:15px 0;}
#post_content ul {list-style:disc;margin:0 0 15px;padding:0 0 0 20px;}
#post_content ol {list-style:decimal;margin:0 0 15px;padding:0 0 0 20px;}
#post_content .conbox {width:99%;margin-right: auto;margin-left: auto;margin-bottom:15px;overflow:hidden;}
#post_content .con_row {overflow:hidden;margin:0;padding:0;}
#post_content .conbox img {width:100%;}
.boxLeft {float:none;}
.boxRight {float:none;}
#post_content .conbox .col-xs-6 {width:100%;}
#post_content .conbox dl {width:100%;float:none;margin:0 0 15px;overflow:hidden;}
#post_content .conbox dl+dl {margin:0 0 15px;}
#post_content .conbox dl dt {width:40%;float:left;margin:0 10px 0 0;}
#post_content .conbox dl dd {width:56%;float:right;margin:0;}



#recentNewPost {display:none;}
#recentNewPost ul li {font-size:15px;}
#newtopics ul li {font-size:15px;}
#feature ul li {font-size:15px;}
#student ul li {font-size:15px;}
#event ul li {font-size:15px;}

#categoryList li .rnp_cate {font-family:'Montserrat', sans-serif;color:#1a1a1a;margin:10px 0 0;display:block;font-size:20px;font-weight:700;color:#1a1a1a;}
#categoryList li .rnp_date {font-family: 'Merriweather', serif;font-weight:100;font-style:italic;margin:0 10px 0 6px;color:#1a1a1a;display:block;}
#categoryList li .rnp_topicImg {width:100%;height:100px !important;background-repeat:no-repeat;background-size:120% auto;background-position:center center;}

.pager{text-align:center;font-family:'Montserrat', sans-serif;margin:0;}
.widget_cont h3.side-title {font-size:18px !important;}
.widget_cont ul li {font-size:16px !important;padding:6px 0;}
.widget_cont ul.recentpostList li {font-size:15px !important;}
.postImg {width:120px;height:80px;background-repeat:no-repeat;background-size:120% auto;margin:0 8px 3px 0;float:left;}



}



@media screen and (max-width: 480px) {



}

@media screen and (max-width: 320px) {

#nav > a{width:2.825em;height: 2.825em;text-align:left;text-indent: -9999px;background-color: #1a1a1a;position: relative;}
#nav > ul{height: auto;display: none;position: absolute;left: 0;right:140px;background-color:rgba(26,26,26,1);z-index:9999;}

#newtopics ul li .topicImg {height:4em;width:30%;float:left;margin-right:15px;margin-bottom:0 0 10px;}
#newtopics ul li:nth-child(2),
#newtopics ul li:nth-child(3),
#newtopics ul li:nth-child(4) {width:90%;margin-right:15px;margin-left:15px;}


#logo {font-size:26px;margin:0.05em 0 0 0;padding: 0;font-weight: 700;line-height: 1em;text-align:center;font-family:'Montserrat', sans-serif;letter-spacing:1px;}
.pager{text-align:center;font-family:'Montserrat', sans-serif;margin:20px 0 0;}
#footer {clear:both;position:relative;margin-top:3em; padding:1em 0 6.5em 0;width:100%;border-top:solid 1px #1a1a1a;text-align:center;}

#food ul li {float:left;width:43.5%;margin:0 8px 10px;text-align:center;}
#food ul li .circleImg {border-radius:50%;background:#DDD;width:100%;height:130px;background-repeat:no-repeat;background-size:120% auto;}


}