@media (max-width: 767px){
.bgpadding{padding:5% 2%}
#event h1{font-size:1.8rem;line-height:1.1em;color:#024D91}
#event .course h1{color:#cd1a74}
#event h2{font-size:1.6rem;line-height:1.2em;padding-bottom:1%;color:#BF0095}
#event .service h2{color:#024D91}
#event h3{font-size:1.5rem}
#event h4{font-size:1.3rem}
#event h1 span,#event h2 span,#event h3 span{display:block}
#event h1 .acc, #event h1 .law{display:inline-block}
.banner{width:100%;height:auto;padding:0 0 25%}
.banner div img{max-width:80%;margin:0 10%}
.banner div:nth-of-type(1){order:3;top:5%;z-index:2}
.banner div:nth-of-type(1):before{display:none}
.banner div:nth-of-type(2){order:4;bottom:4%}
.mediabox{padding:6% 2%}
.mediaflex{padding:3% 0 0;margin:0 auto;width:100%}
.mediaflex>figure{width: 96%;margin: auto;text-align: center;}
.mediaflex>div{width: 90%;margin: auto;}
.mediaflex .mediatxt h4 br{display:none}
.mediatxt h4 span{text-align:left}
.mediaflex:nth-of-type(1) .mediatxt h4,.mediaflex:nth-of-type(2) .mediatxt h4{text-align:center;width:auto}
.mediatxt{width:100%;margin:2% auto 1%}
.mediatxt>div:nth-of-type(1){font-size:1.25em;margin-bottom:5px}
.mediatxt>div:nth-of-type(2){font-size:1.15em}
.mediatxt>div:nth-of-type(2) small{font-size:.9rem}
.mediatxt>p{font-size:1em;margin:0 auto}
.servicegrid{grid-template-columns:repeat(2,1fr);margin:5% auto 0}
.servicegrid>dl{padding:15px 10px 10px}
.servicegrid>dl>dt{font-size:1.2em}
.servicegrid>dl>dt>i{font-size:2rem}
.servicegrid>dl>dd{font-size:1rem}
iframe{width: 100%;height: 203px;}
.gradeflex{padding: 7% 4% 2% 4%;margin: 3% 0 0;}
.gradeflex div{width: 100%;margin: auto;}
.gradeflex div img{max-width: 100%;}
.gradeflex ul{width: 96%;margin: 3% auto;}
.gradeflex li{font-size: 1.3rem;margin:2% 0 1%}
.ibrainflex{width:96%}
.ibrainflex>div{width:100%;margin:2% auto}
.ibrainflex>div>div:nth-of-type(1){font-size:1.3em}
.ibrainflex>div>p,.ibrainflex figure>figcaption{font-size:1rem}
.ibrainflex>div:nth-of-type(1) .flex>figure{width:100%}
.recommendflex>div{width: 98%;}
.coursebox{padding:4% 0 2%}
.courseflex>dl{width:calc(94%/2);margin:2% 1%;padding:0 0 10px}
.courseflex>dl:nth-last-of-type(1){width:96%}
.courseflex>dl>dt{font-size:1.2em}
.courseflex>dl>dd{display:block;padding:8px 0 0;line-height:2em;font-size:1.1em}
.note{font-size:1rem;margin:4% auto 6%}
.navlink li{font-size:1.05em}
.navlink a{margin:1% auto}    
}
/*pad*/
@media (min-width: 768px) and (max-width:1199px) {
#event h1{font-size:2.2rem}
#event h2{font-size:2rem}
.banner{width:100%;height:400px;text-align:center;background:url(../images/0911101_4.png) no-repeat center 50% / 100% auto}
.banner img{width:80%}
.mediabox{padding:2% 4%}
.mediaflex:nth-of-type(1) .mediatxt h4,.mediaflex:nth-of-type(2) .mediatxt h4{width:100%}
.mediaflex:nth-of-type(1) .mediatxt div>figure{margin:0 0 0 auto}
.mediaflex:nth-of-type(2) .mediatxt div>figure{margin:0 auto 0 0}
.servicegrid{margin:1% 2%}
.servicegrid>dl{padding:10px 15px}
.servicegrid>dl>dt{font-size:1.5em;line-height:1.3em;width:4em;margin:0 auto 3px}
.servicegrid>dl>dt>i{font-size:2.2rem}
}
@media(max-width:1200px) {
#BodyHeader,#noie{display:none}
.row1200{width:100%}
.row120{width:100%;margin:auto}
.service_grid{width:96%}
.banner:before{width:100%}
.bgcolor3:before,.bgcolor3:after{display:none}
.mediatxt div>figure{order:1}
.mediatxt h4{order:2}
#BodyHeader_m{text-align:center;height:auto;margin:2% auto}
#BodyHeader_m img{clear:both;height:auto;max-width:100%}
#BodyFooter_rwd{width:100%;background:#FFF;margin:0 auto;padding-top:4%}
#BodyFooter_rwd a{color:#000}
#BodyFooter_rwd #footer_inline img{max-width:100%;margin-bottom:2%}
#BodyFooter_rwd li{font-size:1em;line-height:2em;text-align:center}
#BodyFooter_rwd #footer_address{padding:3% 0 1%;margin:3% 2% 0;border-top:thin solid #999}
#BodyFooter_rwd #footer_address li{font-size:.7em}
#topbutton{width:50px;height:50px;color:#FFF;border-radius:50%;background-color:#000;opacity:.4;right:1%;bottom:17%;position:fixed;line-height:50px;font-size:15px;text-align:center;z-index:99}
#topbutton a{color:#FFF;text-decoration:none;line-height:50px}
}