@charset "UTF-8";


#main_contents{
width: 100%; 
margin: 0 auto;
padding: 0;
color: #221714;
background: #e1d5c5;
font-family: "Hiragino Kaku Gothic ProN", sans-serif;
box-sizing: border-box;
}

#main_contents .newline{
display:none;
}

#main_contents .top_image{
width: 100%;
}

#main_contents img{
display: block;
width: 100%;
max-width: inherit !important;
}

#main_contents #content_area{
max-width: 1200px;
margin: 0 auto;
}

#main_contents h3{
display: inline-block;
width: 100%;
padding: 50px 10px;
margin: 0 auto;
font-size: 25px;
line-height: 50px;
text-align: center;
}

#main_contents h3 span{
font-size: 40px;
}

#main_contents .top_contents{
width: 100%
margin: 0 auto;
padding: 0 10px 50px;
display: -webkit-flex;
display: flex ;
-webkit-justify-content: space-between;
justify-content: space-between;
flex-wrap: wrap;
}

.top_contents .overview{
width: calc(75% - 10px);
width: -webkit-calc(75% - 10px);
margin: 0 10px 0 0;
padding: 25px;
background: #ebe4db;
}

.top_contents .overview h4{
margin: 0;
font-size: 20px;
line-height: 30px;
padding: 0 0 10px;
border-bottom: 2px solid #221714;
}

.top_contents .overview ul{
width: 100%;
margin: 25px 0 0;
padding: 0 0 25px;
display: -webkit-flex;
display: flex ;
-webkit-justify-content: space-between;
justify-content: space-between;
flex-wrap: wrap;
font-size: 18px;
line-height: 34px;
font-weight: bold;
border-bottom: 1px dotted #221714;
}

.top_contents .overview ul li:nth-child(2n+1){
width: 20%;
}

.top_contents .overview ul li:nth-child(2n){
width: 80%;
}

.top_contents .overview ul li span{
display: inline-block;
font-size: 15px;
line-height: 30px;
font-weight: normal;
margin: 2px 0;
}

.top_contents .overview h5{
margin: 25px 0 0;
font-size: 25px;
line-height: 42px;
padding: 0;
text-align: center;
}

.top_contents .overview .contact{
margin: 25px 0 0;
font-size: 22px;
line-height: 42px;
padding: 0;
font-weight: bold;
text-align: center;
}

.top_contents .overview .contact p{
font-size: 18px;
line-height: 28px;
margin: 0 0 20px;
}

.top_contents .overview .contact a.mail_link{
text-decoration: underline;
transition: 0.3s ease-in-out;
}

.top_contents .overview .contact a.mail_link:hover{
text-decoration: none;
opacity: 0.5;
}

.top_contents .overview .contact span{
font-size: 18px;
font-weight: normal;
margin-left: 20px;
}

.top_contents .overview .link_btn{
display: inline-block;
margin: 10px 0;
}

.top_contents .overview .official_link,
.top_contents .overview .entrysheet{
width: 100%;
display: -webkit-flex;
display: flex ;
-webkit-justify-content: space-between;
justify-content: space-between;
flex-wrap: wrap;
margin: 0 0;
}

.top_contents .overview .official_link > div,
.top_contents .overview .entrysheet > div{
width: 49%;
margin: 10px 0;
text-align: center;
}

.top_contents .overview .official_link a,
.top_contents .overview .link_btn div a, 
.top_contents .overview .entrysheet div a{
display: inline-block;
width: 100%;
border-radius: 5px;
margin: 0 auto;
padding: 10px 20px;
box-sizing: border-box;
transition: 0.3s ease-in-out;
text-align: center;
font-size: 18px;
line-height: 18px;
}

.top_contents .overview .official_link a,
.top_contents .overview .link_btn div a{
color: #ebe4db;
background: #221714;
}

.top_contents .overview .entrysheet div a.middleschool{
color: #fff;
background: #ca1c1d;
}

.top_contents .overview .entrysheet div a.highschool{
color: #fff;
background: #195e9f;
}

.top_contents .overview .official_link a p,
.top_contents .overview .link_btn div a p, 
.top_contents .overview .entrysheet div a p{
font-size: 16px;
font-weight: normal;
margin: 10px 0 -2px;
}

.top_contents .overview .official_link a i,
.top_contents .overview .link_btn div a i, 
.top_contents .overview .entrysheet div a i{
display: inline-block;
margin: 0 0 0 5px;
font-size: 14px;
line-height: 16px;
vertical-align: middle;
}

.top_contents .overview .official_link a:hover, 
.top_contents .overview .link_btn div a:hover, 
.top_contents .overview .entrysheet div a:hover{
opacity: 0.5;
}

.top_contents .overview .entrysheet .closed{
border: 1px solid #221714;
border-radius: 5px;
padding: 10px 20px;
box-sizing: border-box;
color: #221714;
font-size: 18px;
line-height: 18px;
}

.top_contents .overview .entrysheet .closed p{
font-size: 16px;
font-weight: normal;
margin: 10px 0 -2px;
}

#main_contents .sub_contents{
width: 25%;
margin: 0 auto;
}

.sub_contents .contents_box{
width: 100%;
padding: 25px;
margin: 0 auto 10px;
background: #ebe4db;
}

.sub_contents .contents_box_title{
margin: 0 0 25px;
font-size: 20px;
line-height: 30px;
padding: 0 0 10px;
border-bottom: 2px solid #221714;
font-weight: bold;
}

.contents_box .access{
width: 100%;
margin: 10px 0 0;
font-size: 15px;
line-height: 25px;
font-weight: bold;
text-align: center;
}

.contents_box .access p{
font-weight: normal;
font-size: 12px;
margin: 5px 0 0;
padding: 10px 0;
border-top: 1px solid #221714;
border-bottom: 1px solid #221714;
}

.contents_box .twitter_wrapper{
width: 100%;
margin: 0 auto;
overflow-y: scroll;
overflow-x: hidden;
-ms-overflow-style: none;
scrollbar-width: none; 
height: 600px;
box-sizing: border-box;
border: 1px solid #221714;
}

.contents_box .twitter_wrapper .twitter_space{
width: 100%;
height: 100%;
box-sizing: border-box;
}

.contents_box .twitter_wrapper::-webkit-scrollbar {
display:none;
}

.sub_contents .ext_link{
width: 100%;
margin: 0 auto 10px;
}

.sub_contents .box_nospace{
margin: 0 auto !important;
}

.important{
color:#b93129;
}



@media only screen and (max-device-width: 750px) {

#main_contents{
width: 100%; 
min-width: auto
}

#main_contents .newline{
display: inline;
}

#main_contents h3{
font-size: 20px;
line-height: 30px;
padding: 30px 10px;
}

#main_contents h3 span{
font-size: 30px;
line-height: 44px;
}

#main_contents .top_contents{
width: 100%;
margin: 0 auto;
padding: 0 20px 30px;
}

.top_contents .overview{
width: 100%;
margin: 0 auto 10px;
padding: 20px 15px;
}

.top_contents .overview h4{
text-align: center;
}

.top_contents .overview ul li:nth-child(2n+1){
width: 100%;
font-size: 16px;
line-height: 32px;
}

.top_contents .overview ul li:nth-child(2n){
width: 100%;
font-size: 15px;
line-height: 31px;
padding: 0 10px;
}

.top_contents .overview ul li span{
font-size: 12px;
line-height: 24px;
}

.top_contents .overview .link_btn{
display: block;
}

.top_contents .overview .official_link > div,
.top_contents .overview .entrysheet > div{
width: 100%;
margin: 10px 0;
}

.top_contents .overview .official_link a,
.top_contents .overview .link_btn div a, 
.top_contents .overview .entrysheet div a{
font-size: 16px;
line-height: 16px;
display: inline-block;
}

.top_contents .overview .official_link a p,
.top_contents .overview .link_btn div a p, 
.top_contents .overview .entrysheet div a p{
font-size: 10px;
margin: 5px 0 -4px;
}

.top_contents .overview .official_link a i,
.top_contents .overview .link_btn div a i, 
.top_contents .overview .entrysheet div a i{
font-size: 12px;
line-height: 12px;
}

.top_contents .overview .entrysheet .closed{
font-size: 16px;
line-height: 16px;
}

.top_contents .overview .entrysheet .closed p{
font-size: 10px;
margin: 5px 0 -4px;
}

.top_contents .overview h5{
font-size: 20px;
line-height: 30px;
}

.top_contents .overview .contact{
margin: 20px 0 0;
font-size: 18px;
line-height: 34px;
}

.top_contents .overview .contact span{
font-size: 16px;
margin-left: 10px;
}

.top_contents .overview .contact p{
font-size: 15px;
line-height: 25px;
margin: 0 0 20px;
}

#main_contents .sub_contents{
width: 100%;
margin: 0 auto;
}

.sub_contents .contents_box{
width: 100%;
padding: 20px 15px;
}


.sub_contents .contents_box_title{
text-align: center;
}

.contents_box .twitter_wrapper{
height: 500px;
}