@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@100;300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');
/* ======================================================================================

    reset

====================================================================================== */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, figure, article, section { margin: 0; padding: 0; border: 0; outline: 0; box-sizing: border-box;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } ol, ul { list-style: none; } blockquote, q { quotes: none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through; }

img{vertical-align:middle; width:100%; height:auto;}

@media only screen and (max-width:767px) {
.imgSP{padding-left: 15%; padding-right: 15%;}
}


html,body{height: 100%;}

body{
position: relative;
font-size:.9rem;
line-height: 1.8;
color:#000;
font-family: 'Raleway', sans-serif;
}

a,a img,a:hover img,li,li:hover,a::after,a:hover::after,a::before,a:hover::before,input,input:hover,.trigger,.trigger:hover,i,i:hover{-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;}

a:link {text-decoration:underline; color:#000;}
a:visited {text-decoration:underline; color:#000;}
a:hover{text-decoration:underline; color:#6C5500;}

a:hover img{opacity:0.7; filter: alpha(opacity=70); -ms-filter: "alpha( opacity=70 )";}

p{margin:0 0 20px 0; padding:0;}
p.lp{margin:0 0 0px 0; padding:0;}

h1,h2,h3,h4,h5{font-weight:normal; margin:0; padding:0; position: relative; width: 100%; line-height: 1.2;}

td,li,dt,dd{position: relative;}

/* ======================================================================================

    common

====================================================================================== */

.flex{
display:-webkit-box;
display:-moz-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
justify-content: space-between;
-webkit-justify-content: space-between;
-moz-justify-content: space-between;
-ms-justify-content: space-between;	
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}

.flexB{
display:-webkit-box;
display:-moz-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}

.flex-end{align-items: flex-end;}

.flex2 li{width:48%;}
.flex3 li{width:32%;}
.flex4 li{width:24%;}
.flex5 li{width:19%;}

.flex2 li,
.flex3 li,
.flex4 li,
.flex5 li{margin-bottom: 30px; position: relative;}

.flex_box li,.box01{border-radius:10px; padding:20px; overflow:hidden; position: relative; box-shadow: 0px 0px 15px rgba(0,0,0,.2)}

.inner,#header nav ul{margin:0 auto; position:relative; max-width:1140px; padding:0 20px;}
.inner3{padding:0 1%;}

.icon{-moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; padding:0px 4px;}
.icon_blue{background: #000DB3; color: #fff; text-shadow:none;}

.Photo2flex{display: flex; justify-content: space-between;}
.Photo2flex img{width: 49.5%;}


@media only screen and (max-width:767px) {
.inner{margin:0 auto; width: 90%; padding: 0;}
.flex2 li,.flex3 li,.flex4 li,.flex5 li{width:100%;}
.inner3{padding:0 5%;}
}


.ul00 li{padding: 5px 0 5px 15px; position: relative;}
.ul_num li{ list-style: decimal; margin-left: 20px;}

.ul01 li{padding: 2px 0 2px 15px; position: relative; margin-bottom: 10px;}
.ul01 li::before{
position: absolute;
content: '';
border-radius:100%;
top: .85rem;
left: .3rem;
z-index: 2;
width: 3px;
height: 3px;
background: rgba(0, 0, 0, 1);}

.ul02 li{padding: 5px 0; border-bottom: #C89E9F dotted 1px; position: relative;}

.ul_memo li{margin-left: 20px; font-size: 80%; padding: 5px 0; position: relative;}
.ul_memo li::before{content: '※'; position: absolute; top: 5px; left: -15px;}


table.table01{width: 100%; border-collapse:collapse; line-height: 1; font-size: .8rem}
.table01 th{padding: 5px;}
.table01 td{padding: 5px;}

table.table02{width: 100%; border-collapse:collapse; line-height: 1; font-size: .9rem; table-layout: fixed;}
.table02 th{border: #ccc solid 1px; padding: 10px;}
.table02 td{border: #ccc solid 1px; padding: 10px;}

table.table02 tr,
table.table02 td{overflow-wrap: break-word;
	word-wrap: break-word;}


@media only screen and (max-width:767px) {
table.table02{font-size: .7rem}
.table02 th{border: #ccc solid 1px; padding: 5px;}
.table02 td{border: #ccc solid 1px; padding: 5px;}
}

.nth tr:nth-child(odd){background: #F8F8F3;}


.box02{margin-bottom:20px; padding:20px; position: relative; border-bottom:#a00000 dotted 1px;}

a.bt01{text-decoration:none; border-radius:10px; padding:5px 30px 5px 15px; position:relative; border: #000 solid 1px;}
a.bt01:link,a.bt01:visited{text-decoration:none; color:#000;}

a.bt01::after{content:'';
    height: 0;
    position: absolute;
    width: 0;
    border:4px solid transparent;
    border-left-color: #000;
    right:2%;
    top: 0;
	bottom: 0;
	margin: auto;
	z-index:1;}
a.bt01:hover::after{right:.5%; border-left-color: #000;}

span.bt01{text-decoration:none; border-radius:10px; padding:5px 30px 5px 15px; position:relative; border: #bbb solid 1px; color: #bbb; display: block;}

a.bt02{text-decoration:none; border-radius:100px; position:relative; width: 35px; height: 35px; border: #000 solid 1px; display: inline-block;}
a.bt02:link,a.bt02:visited{text-decoration:none; color:#000;}

a.bt02::after{content:''; position: absolute; width: 0; height: 0; border:8px solid transparent; border-left-color: #000; z-index:1; top: 50%; left: 50%; transform: translate(-25%,-50%);}
a.bt02:hover::after{transform: translate(0%,-50%);}


a.bt03{text-decoration:none; border-radius:10px; padding:20px 30px; position:relative; border: #000 solid 0px; box-shadow: 0px 0px 15px rgba(0,0,0,.2); display: block; text-align: center; font-size: 120%; animation:BGflash 1.5s both; animation-iteration-count: infinite;}
a.bt03:link,a.bt03:visited{text-decoration:none; color:#000;}
a.bt03::after{content:'';
    height: 0;
    position: absolute;
    width: 0;
    border:5px solid transparent;
    border-top-color: #000;
	bottom: 0;
	left: 50%;
	transform: translate(-50%,0);
	z-index:1;}
a.bt03:hover::after{bottom: -3px;}


a.bt04{text-decoration:none; border-radius:10px; padding:20px 30px; position:relative; border: #000 solid 0px; box-shadow: 0px 0px 15px rgba(0,0,0,.2); display: block; text-align: center; font-size: 120%;}
a.bt04:link,a.bt04:visited{text-decoration:none; color:#000;}
a.bt04:hover{text-decoration:none; background-color: #FFF0DE;}
a.bt04::after{content:'';
    height: 0;
    position: absolute;
    width: 0;
    border:5px solid transparent;
    border-top-color: #000;
	bottom: 0;
	left: 50%;
	transform: translate(-50%,0);
	z-index:1;}
a.bt04:hover::after{bottom: -3px;}

a.bt05{text-decoration:none; position:relative; display: inline-block;}
a.bt05:link,a.bt05:visited{text-decoration:underline; color:#000;}
a.bt05:hover{color: #730001;}

.bt_tw{font-size: 90%;}
.bt_tw i{margin-right: 10px; color: #0070BE; font-size: 30px;}

a.bt_flyer{display: inline-block; font-size: 80%; border: #A89149 solid 1px; padding: 5px 30px 5px 10px; border-radius: 500px; position: relative;}
a.bt_flyer:link,a.bt_flyer:valid{text-decoration: none;}
a.bt_flyer i.fa-file-image{margin-right: 5px;}
a.bt_flyer i.fa-circle-chevron-right{position: absolute; top: 50%; right: 10px; transform: translate(0,-50%); color: #A89149;}
a.bt_flyer:hover i.fa-circle-chevron-right{right: 5px;}

@keyframes BGflash {
0% {background-color: #fff;}
50%{background-color: #FFF0DE;}
100%{background-color: #fff;}
}



@media only screen and (max-width:767px) {
a.bt01,a.bt02{display: block;}
}



/** アコーディオン
-------------------------------------------------- */


ul.acordion{margin:0; padding:0; border-radius: 10px; width: 100%;}
ul.acordion .trigger{cursor: pointer; display: block; padding: 20px 40px 20px 0; font-size: 1.6rem; position: relative;}
ul.acordion .trigger:hover{color: #E05D60;}

ul.acordion li{position:relative; border-bottom: #ccc dotted 1px;}

ul.acordion .trigger::after{
content: "";
position: absolute;
right: 5px;
top: 50%;
transform: translate(0%,-50%);
width: 0px;
height: 0px;
border-style: solid;
border-color: #ccc transparent transparent transparent ;
border-width: 7px 5px 0px 5px;
}

ul.acordion li .active-submenu::after{border-width: 0px 5px 7px 5px; border-color:  transparent transparent #ccc transparent ;}


ul.acordion li .submenu{padding-bottom: 50px;}
ul.acordion li ul {margin-bottom: 20px}
ul.acordion li ul li{position:relative; border: #000 solid 0px; margin-bottom: 0px; padding: 0px 0px 0px 15px;}


@media only screen and (max-width:767px) {
ul.acordion .trigger{font-size: 1rem;}
}

/* == anime == */
.delay1{animation-delay: 1s;}
.delay2{animation-delay: 2s;}
.delay3{animation-delay: 3s;}
.delay4{animation-delay: 4s;}

@keyframes show {
0% {opacity: 0;}
100% {opacity: 1;}
}


/* == header == */

#header{background: rgba(134,71,79,1); position: fixed; top: 0; width: 100%; z-index: 3; border-bottom:#86474f solid 1px;}
#header .logo{width:200px; padding: 2px 0 4px;}

#header nav{width:100%; background: #fff;}
#header nav ul li{text-align: center; line-height: 1.3; padding: 5px 0; position: relative; height: 30px;}
#header nav ul li a{font-size: .8rem; font-weight: 400; text-shadow: 1px 1px rgba(0,0,0,0); text-decoration: none; display: block;}

#header a:link,#header a:visited {color:#86474f;}
#header a:hover{color:rgba(255,190,190,1);}

#header nav ul li a::after{
content: "";
position: absolute;
top: 0;
left: 50%;
width: 0px;
height: 0px;
transform: translate(-50%,0);
border-style: solid;
border-color: #86474f transparent transparent transparent;
border-width: 6px 6px 0 6px;
opacity: 0;}

#header nav ul li a:hover::after{opacity: 1;}

#header .inner{display: flex; flex-wrap: wrap; justify-content: space-between;}
#header .inner .SnsArea{display: flex; flex-wrap: wrap; justify-content: space-between;}
#header .inner .SnsArea li{width: 50px; padding: 5px 10px;}
#header .inner .SnsArea li.LangArea{width: 120px; font-size: .7rem; line-height: 1;}

#header .inner .SnsArea li.LangArea a{display: block; position: relative; padding: 2px 8px 2px 0; text-decoration: none; color: #fff;}
#header .inner .SnsArea li.LangArea a i{position: absolute; top: 50%; right: 5px; transform: translate(0,-50%); font-size: .5rem;}
#header .inner .SnsArea li.LangArea a:hover i{right: 1px;}

@media only screen and (max-width:767px) {
#header .inner .SnsArea{display: none;}
#header nav{display: none;}
}

.menu > .menu__single {
  position: relative;
}

.menu__single .menu__second-level{
  position: absolute;
  top: 0px;
  width: 100%;
  -webkit-transition: .2s ease;
  transition: .2s ease;
  visibility: hidden;
  opacity: 0;
  background: #fff;
}

.menu__single .menu__second-level li{border-top: #86474f dotted 1px; width: 100%;}

.menu__single:hover > .menu__second-level {
  top: 8px;
  visibility: visible;
  opacity: 1;
}

.menu__single .menu__second-level a::after{display: none;}

.menu__single a:hover{color:#86474f !important;}
.menu__single .menu__second-level a:hover{color:rgba(255,190,190,1) !important;}

/* == Visual == */

.MainVisual{position: relative; height: 600px; overflow: hidden;}

.video-area{
    position: fixed;
    z-index: -1;/*最背面に設定*/
    top: 0;
    right:0;
    left:0;
    bottom:0;
    overflow: hidden;
}

.MVvideo {
    /*天地中央配置*/
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*縦横幅指定*/
    width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
    height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
    min-height: 100%;
    min-width: 100%;
}

.dotpattern {
  background: rgba(0,0,0,.2);
  background-image: radial-gradient(rgba(0,0,0,.5) 40%, transparent 0), radial-gradient(rgba(0,0,0,.5) 40%, transparent 0);
  background-position: 0 0, 2px 2px;
  background-size: 4px 4px;
  width: 100%;
  height: 100%;
  position: relative;
}


.bg-slider {
	width: 100vw;
	height: 600px;
	background-position:center center;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
}

.SubVisual{width: 100vw; height: 350px; position: relative;}

.AboutVisual{background: url("../img/about/visual.jpg") center center no-repeat; background-size: cover;}
.StudyVisual{background: url("../img/study/visual.jpg") center center no-repeat; background-size: cover;}
.EventsVisual{background: url("../img/event/visual.jpg") center center no-repeat; background-size: cover;}
.FacultyVisual{background: url("../img/faculty/visual.jpg") center center no-repeat; background-size: cover;}
.AccessVisual{background: url("../img/access/visual.jpg") center center no-repeat; background-size: cover;}
.MlaVisual{background: url("../img/mla/visual.jpg") center center no-repeat; background-size: cover;}
.AdmiVisual{background: url("../img/admissions/photo01.jpg") center center no-repeat; background-size: cover;}
.InternationalVisual{background: url("../img/international/photo01.jpg") center center no-repeat; background-size: cover;}
.MasterVisual{background: url("../img/master/photo01.jpg") center center no-repeat; background-size: cover;}
.DomitoryVisual{background: url("../img/domitory/visual.jpg") center center no-repeat; background-size: cover;}
.AlumniVisual{background: url("../img/alumni/photo01.jpg") center center no-repeat; background-size: cover;}

.VocalVisual{background: url("../img/study/voice01.jpg") center center no-repeat; background-size: cover;}
.PianoVisual{background: url("../img/study/piano01.jpg") center center no-repeat; background-size: cover;}
.StringsVisual{background: url("../img/study/stringed.jpg") center center no-repeat; background-size: cover;}
.PercussionVisual{background: url("../img/study/percussion.jpg") center center no-repeat; background-size: cover;}
.ConductingVisual{background: url("../img/study/conductor.jpg") center center no-repeat; background-size: cover;}
.CompositionVisual{background: url("../img/study/compose.jpg") center center no-repeat; background-size: cover;}
.EducationVisual{background: url("../img/study/education.jpg") center center no-repeat; background-size: cover;}
.WindVisual{background: url("../img/study/brassband.jpg") center center no-repeat; background-size: cover;}

.MasterOfMusicVisual{background: url("../img/study/visual.jpg") center center no-repeat; background-size: cover;}
.DoctoralVisual{background: url("../img/study/visual.jpg") center center no-repeat; background-size: cover;}

.MusicBusinessAndTechnologyVisual{background: url("/cms/wp-content/uploads/2024/05/MBT4.jpg") center center no-repeat; background-size: cover;}

.SubVisual h1{text-align: center; color: #fff; font-size: 3rem; width: 100%; position: absolute; top: 50%;}
.SubVisual h1 span.Sub{font-size: 50%; display: block; }
@media only screen and (min-width:768px) {
.bg-slider {background-attachment: fixed;}
}

.bg-slider .caption{width: 30%; position: absolute; top:50%; left: 5%; transform: translate(0%,-50%); border: #fff solid 0px; padding: 20px; animation:show 1s both; animation-delay: .5s;}


@media only screen and (max-width:767px) {
.SubVisual h1{font-size: 2rem; transform: translate(0,-50%);}
.MainVisual{height: 400px;}
.bg-slider .caption{width: 90%;}
}

/* == top == */

section.TopNewsArea{background: #F5F2EC;}
section.TopNewsArea .inner{padding-left: 30px; padding-right: 30px;}
section.TopNewsArea ul li{padding: 5px;}
section.TopNewsArea .thumbnail{height: 150px; overflow: hidden; margin-bottom: 10px; position: relative;}
section.TopNewsArea .thumbnail img{position: absolute; left: 0; top: 50%; transform: translate(0,-50%);}
section.TopNewsArea .Day{font-size: .7rem; margin-bottom: 5px; color: #666; text-align: center;}
section.TopNewsArea .caption{font-size: .8rem; min-height: 100px;}
section.TopNewsArea a.bt01{font-size: 80%; display: block; text-align: center;}

ul.TopTopics{display: flex; flex-wrap: wrap; justify-content: center; width: 90%; margin: 0 auto;}
ul.TopTopics li{width: 33.3333%; padding: 0px 1%; margin-bottom: 20px; text-align: center; position: relative;}
ul.TopTopics li h2{position: absolute; top: -20px; left: 0; font-size: 3rem; font-family: 'Anton'; color: #fefefe; position: absolute; text-shadow: 1px 1px 8px rgba(0,0,0,.5); text-align: left; z-index: 2;}

section.EnglishNews .inner{padding-top: 150px;}
section.NewsImg img{width: 100%; padding: 30px 25%;}

section.EnglishNews ul.PostLink{display: flex; flex-wrap: wrap; justify-content: space-between; padding-top: 30px; border-top: #666 dotted 1px;}
section.EnglishNews ul.PostLink li{width: 50%;}
section.EnglishNews ul.PostLink li.prev{text-align: left; padding-right: 10px;}
section.EnglishNews ul.PostLink li.next{text-align: right; padding-left: 10px;}
section.EnglishNews ul.PostLink li span{font-size: 80%; display: block;}

section.EnglishNews ul.sns{display: flex; flex-wrap: wrap; justify-content: center; font-size: 2rem;}
section.EnglishNews ul.sns li{padding: 10px;}
section.EnglishNews ul.sns a{color: #fff; position: relative; display: inline-block;}
section.EnglishNews ul.sns a::after{position: absolute; content: ""; width: 50px; height: 50px; border-radius: 100%; z-index: -1; top: 50%; left: 50%; transform: translate(-50%,-50%);}
section.EnglishNews ul.sns li.insta a::after{background-image: linear-gradient(150deg, rgba(247, 166, 12, 1) 10%, rgba(255, 34, 87, 1) 40%, rgba(154, 39, 238, 1) 68%, rgba(35, 102, 247, 1) 90%);}

section.EnglishNews .entry-header{display: flex; flex-wrap: wrap; justify-content: space-between; border-bottom: #666 dotted 1px; padding: 30px 0;}
section.EnglishNews .entry-header .thumbnail{width: 250px;}
section.EnglishNews .entry-header .TitleArea{flex: 1; padding-left: 30px;}
section.EnglishNews .entry-header .entry-title{font-size: 1.1rem;}

section.EnglishNews .Day{font-size: 1.2rem; margin-bottom: 20px; color: #666; text-align: center;}
section.EnglishNews .entry-header .Day{font-size: .9rem; margin-bottom: 5px; color: #666; text-align: left;}


@media only screen and (max-width:767px) {
section.TopNewsArea .thumbnail{height: 130px; margin-bottom: 5px;}

ul.TopTopics li{width: 100%; margin-bottom: 70px; padding: 0px 0%;}
ul.TopTopics li h2{font-size: 2rem;}

section.EnglishNews .inner img{padding: 20px 10%;}

section.EnglishNews .entry-header .thumbnail{width: 100%;}
section.EnglishNews .entry-header .TitleArea{padding-left: 0px;}
section.EnglishNews .entry-header .entry-title{font-size: 1rem;}
}

.flexTopStudy li{border: #000 solid 1px; border-radius: 10px 0 0 0; padding: 10px; width: 31.33333%; margin: 0 1% 20px;}
.flexTopStudy2 li{width: 25%; padding: 15px; border-bottom: #DDD2C9 solid .05rem; position: relative;
background: rgb(255,250,247);
background: -moz-linear-gradient(-45deg,  rgba(255,250,247,1) 0%, rgba(234,226,220,1) 100%);
background: -webkit-linear-gradient(-45deg,  rgba(255,250,247,1) 0%,rgba(234,226,220,1) 100%);
background: linear-gradient(135deg,  rgba(255,250,247,1) 0%,rgba(234,226,220,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffaf7', endColorstr='#eae2dc',GradientType=1 );}

.GradationBox{width: 50%; padding:30px 50px; overflow:hidden; position: relative; color: #FFFFFF; line-height: 1.4; text-decoration: none;}
.GradationBox{background: rgb(170,46,98);
background: -moz-linear-gradient(-45deg,  rgba(170,46,98,1) 1%, rgba(114,0,74,1) 100%);
background: -webkit-linear-gradient(-45deg,  rgba(170,46,98,1) 1%,rgba(114,0,74,1) 100%);
background: linear-gradient(135deg,  rgba(170,46,98,1) 1%,rgba(114,0,74,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aa2e62', endColorstr='#72004a',GradientType=1 );
}

.GradationBox h3{font-size: 1.4rem; font-weight: 100; text-align: center; border-bottom: #fff dotted 1px; margin-bottom: 10px; padding-bottom: 10px}
.GradationBox a{text-decoration:none; border-radius:5px; padding:3px 20px 3px 15px; position:relative; color: #fff; border: #fff dotted 1px; font-size: .7rem}
.GradationBox a::after{content:'';
    height: 0;
    position: absolute;
    width: 0;
    border:3px solid transparent;
    border-left-color: #fff;
    right:2%;
    top: 0;
	bottom: 0;
	margin: auto;
	z-index:1;}
.GradationBox a:hover::after{right:.5%; border-left-color: #fff;}
.GradationBox h4{font-size: 1.2rem; font-weight: 100; margin-bottom: 10px; text-align: center;}

dl.dl01{}
dl.dl01 dt{}
dl.dl01 dd{margin-top:-25px; margin-bottom: 10px; padding-left: 50px; padding-bottom: 10px; border-bottom: #666 dotted 1px;}

dl.dl02 dt{font-weight: bold;}
dl.dl02 dd{margin-bottom: 10px; padding-bottom: 10px; border-bottom: #666 dotted 1px;}


@media only screen and (max-width:767px) {
.flexTopStudy2 li{width: 50%;}
.GradationBox{width: 100%;}
}

.googlemap{border:0; width:100%; height: 250px; filter:grayscale(100%); -webkit-filter:grayscale(100%);}



/* == about us == */
.AboutUsUl1{display:flex; flex-wrap: wrap; justify-content: space-between; width: 100%; padding: 0 5% 50px;}
.AboutUsUl1 li{width: 22%;}

.AboutCompeUl{display:flex; flex-wrap: wrap; justify-content: space-between;}
.AboutCompeUl li{width: 48%; border-left: #a00000 solid 2px; padding-left:10px; margin-bottom: 10px; line-height: 1;}

.conductor{display: block; font-size: 90%;}

.FromCollege{text-align: center; font-size: 90%; margin-bottom: 50px; position: relative;}
.FromCollege i{font-size: 8rem; display: block;}
.FromCollege::after{content: ''; position: absolute; bottom: -30px; left: 50%; transform: translate(-50%,0);  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #fde7d1 transparent transparent transparent;
  border-width: 20px 20px 0 20px;}

.CumpusHall{display: flex; flex-wrap: wrap; justify-content: center;}
.CumpusHall li{width: 23%; margin: 0 1% 0px; text-align: center;}

@media only screen and (max-width:767px) {
.AboutUsUl1 li{width: 48%;}
.AboutCompeUl li{width: 100%;}
.CumpusHall li{width: 48%; margin: 0 1% 40px;}
}

/* == study == */
.StudyBoxArea{position: relative; margin-bottom: 80px; padding-top: 20px;}
.StudyBoxArea h4{font-size: 3.5rem; font-family: 'Anton'; color: #fefefe; position: absolute; top: -20px; left: 0px; text-shadow: 2px 2px 8px rgba(0,0,0,.5);}
.StudyBoxImg{max-width: 600px; margin: 0 auto; position: relative; padding: 0 50px 30px;}
.StudyBoxArea ul{display: flex; flex-wrap: wrap; margin-bottom: 10px;}
.StudyBoxArea li{width: 32%; margin: 0 .66666%; padding: 5px 15px; margin-bottom: 10px; text-align: center; border-radius: 100px; border: #ccc solid 1px; font-size: 80%;}


.comp_date{width: 10%;}
.comp_event{}
.comp_venue{width: 20%;}
.comp_time{width: 10%;}
.comp_tickets{width: 15%;}

sextion.GraduateProgramsArea a,
sextion.GraduateProgramsArea a:link,
sextion.GraduateProgramsArea a:visited{color: #fff;}

@media only screen and (max-width:767px) {
.comp_date{width: 10%;}
.comp_event{}
.comp_venue{width: 20%;}
.comp_time{width: 10%;}
.comp_tickets{width: 15%;}
}


/* == faculty == */
.facultyArea{border: #666 solid 1px; border-radius: 10px; padding: 50px 20px 20px; position: relative; overflow: hidden; width: 49%;}
.facultyArea .heading{position: absolute; top: 0; left: 0; background: #600001; color: #fff; padding: 5px 10px; text-align: center; font-size: 1.2rem;}
.facultyArea dl{margin-bottom: 40px;}
.facultyArea dt{font-weight: bold; margin-bottom: 10px; font-size: 1rem; color: #600001;}
.facultyArea dd{border-bottom: #666 dotted 1px; padding-bottom: 20px; margin-bottom: 20px;}
.facultyArea dd.NoBorder{border-bottom: #666 dotted 0px;}
.facultyArea dd:last-child{border-bottom: #666 dotted 0px; padding-bottom: 0px; margin-bottom: 0px;}
.facultyArea dd ul{display: flex; flex-wrap: wrap;}
.facultyArea dd ul li{padding: 0 15px; margin-bottom: 20px;}
.facultyArea .subtitle{font-size: 80%; display: block;}

.facultyArea .heading3{font-size: 1rem; color: #600001; border-top: #600001 solid 2px; border-radius: 10px; padding-top: 10px;}

@media only screen and (max-width:767px) {
.facultyArea dd ul li{margin-bottom: 15px; width: 50%;}
.facultyArea{width: 100%;}
}

/* == Music Liberal Arts == */
.mla_mainfeatures li{font-size: 1.5rem; font-family: 'Anton'; text-shadow: 1px 1px 5px rgba(0,0,0,0); text-align: center; color: #95084E;}
.mla_mainfeatures{position: relative;}
.mla_mainfeatures::after{position: absolute; content: ''; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: -1;
  width: 450px;
  height: 450px;
  border-radius: 50%;
  border: solid 1px #E699B6;}
.syllabusli a{display: block;}

/* == international == */
.BoxApply{padding: 30px 15px 15px; border-radius: 15px; position: relative; width: 30%; margin-bottom: 50px; border: #840002 solid 1px;}
.BoxApply .ApplyDay{position: absolute; background: #840002; color: #fff; padding: 2px 10px; border-radius: 15px 0 15px 0; top: 0; left: 0; font-size: .8rem;}
.BoxApplyR::after{content: ""; position: absolute; top: 50%; right: -12%; width: 0px; height: 0px; transform: translate(0%,-50%); border-style: solid; border-color: transparent transparent transparent #86474f; border-width: 9px;}
.BoxApplyB::after{content: ""; position: absolute; width: 0px; height: 0px; border-style: solid; border-width: 9px; top: 120%; right: 50%; transform: translate(50%,0%); border-color: #86474f transparent transparent transparent;}
.BoxApplyL::after{content: ""; position: absolute; top: 50%; right: 108%; width: 0px; height: 0px; transform: translate(0%,-50%); border-style: solid; border-color: transparent #86474f transparent transparent; border-width: 9px;}
@media only screen and (max-width:767px) {
.BoxApply{width: 100%;}
.BoxApplyR::after,
.BoxApplyL::after{top: 120%; right: 50%; transform: translate(50%,0%); border-color: #86474f transparent transparent transparent;}
}

.mlaArea{position: absolute; bottom: 20px; min-width: 100px; min-height: 100px; border-radius: 0 10px 10px 0; background: #871F21; z-index: 2; left: 0; padding: 20px; color: #fff;}
.mlaArea p{font-family: 'Anton'; letter-spacing: 1px;}
.mlaArea a.bt01{color: #fff; border: #fff solid 1px;}
.mlaArea a.bt01::after{border-left-color: #fff;}

@media only screen and (max-width:767px) {
.mlaArea{bottom: 0px; width: 100%; min-height: 10px; border-radius: 0 0px 0px 0; padding: 10px;}
.mlaArea p{font-family: 'Anton'; letter-spacing: 1px; font-size: .7rem; text-align: center; margin-bottom: 5px;}
.mlaArea a.bt01{font-size: .8rem;}
}


.photogallery li{width: 33.33333%; padding: 0; margin: 0;}

/* == Master Class == */
.tableMC th{width: 15%;}
.tableMC td.sns{width: 8%; text-align: center;}
.tableMC td.sns .fa-image{margin: 0 3px;}

@media only screen and (max-width:767px) {
.tableMC td.sns .fa-image{margin: 3px 3px;}
}


/* == Alumni == */
section.AlumniArea .inner{padding-top: 50px; padding-bottom: 50px;}
section.AlumniArea .ImgArea{width: 250px; text-align: center; font-size: 80%;}
section.AlumniArea .ImgArea img{margin-bottom: 10px;}
section.AlumniArea .TxtArea{flex: 1; padding-left: 40px;}
@media only screen and (max-width:767px) {
section.AlumniArea .ImgArea{width: 100%; padding: 0 20% 50px;}
section.AlumniArea .TxtArea{flex: 1; padding-left: 0px;}
}

/* == International Students == */
ul.OurPartnerUniversities li{text-align: center;}


/* == footer == */
#footer a{color: #fff;}

#footer{position: relative; z-index: 1; background: #86474f; color: #fff}
#footer .inner{padding-top: 10px; padding-bottom: 10px; font-size: .8rem;}
#footer .CampusBox .fa-solid{margin-right: 5px;}
#footer .CampusBox{width: 45%;}
#footer .CampusName{font-size: 1rem; font-weight: 400; border-bottom: #fff dotted 1px; margin-bottom: 5px;}

.flex_tel{display:-webkit-box;
display:-moz-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;}

.flex_tel li{padding-right: 20px;}

.footerLink li{padding-left: 15px; position: relative;}

.footerLink a::after{content:'';
    height: 0;
    position: absolute;
    width: 0;
    border:4px solid transparent;
    border-left-color: #fff;
    left:0%;
    top: 0;
	bottom: 0;
	margin: auto;
	z-index:1;}
.footerLink a:hover::after{left:5px; border-left-color: #fff;}

@media only screen and (max-width:767px) {
.flex_tel li{width: 100%;}
}

.copy{text-align:center; font-size:.7rem; border-top: #fff solid .05rem;}


/* == section == */
main#maincolumn{padding: 50px 0;}
section{position:relative;}
section.fullarea{padding-top: 50px; padding-bottom: 50px;}
section .inner,.inner2,.inner3{position:relative; padding-top: 90px; padding-bottom: 90px;}
article{margin-bottom: 70px; position: relative;}

/* == heading == */
.heading1{font-size: 2.5rem; text-align: center; margin-bottom: 50px; position: relative; color: #86474f; padding-bottom: 30px;}
.heading2{font-size: 1.1rem; font-weight: 300; margin-bottom: 20px; border-radius: 100px; color: #86474f; border: #86474f solid 1px; padding: 3px 5px; text-align: center;}
.heading3{font-size: 1.6rem; font-weight: 300; text-align: center; margin-bottom:20px;}
.heading4{font-size: 1.1rem; font-weight: 300; text-align: center; margin-bottom:10px;}
.heading5{font-size: 3rem; text-align: center; color: #666;}
.heading6{font-size: 1.2rem; font-weight: 300; margin-bottom: 20px; color: #86474f; text-align: center;}

span.subheading1{font-size: 1rem; display: block; font-weight: 300; line-height: 2;}
span.subheading2{font-size: 80%; font-weight: 300; margin-left: 5px;}
span.subheading3{font-size: 80%; display: block; font-weight: 300; line-height: 1.2;}

.heading1::before{content: ''; background: url("../img/common/heading_bg1.png") center bottom no-repeat; background-size: 300px; bottom:0px ; left: 0; width: 100%; height: 100%; position: absolute;}

@media only screen and (max-width:767px) {
.heading1{font-size: 2rem;}
span.subheading2{display: block; margin-left: 0px;}
}

/* == form == */

input, button, textarea, select {margin:0; padding:10px; width:100%; background:#fff; border:#d25c43 solid 2px; border-radius:5px; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; margin-bottom: 30px;}

.textarea_h{min-height:200px;}

.bt_submit{background:#424343; color:#FFF; font-size:18px; border-radius:50px;}
.bt_submit:hover{background:#d25c43;}

.formtitle{margin-bottom: 5px;}

.checkbox-wrap{}
.label-checkbox input[type="checkbox"]{display: none;}
.label-checkbox{cursor: pointer;position: relative;}
.label-checkbox .lever{
  display: block;
  color: #979797;
  font-weight: normal;
  display: inline-block;
  padding: 8px 40px;
  border: 1px solid #979797;
  border-radius:20px;
  margin-right: 10px;
  margin-bottom: 10px;
  -webkit-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-checkbox .lever:before{
  content:'';
  position: absolute;
  left: 10px;
  top:-3px;
  border: 1px solid #979797;
  background: #fff;
  width: 20px;
  height: 20px;
  border-radius:100%;
  -webkit-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 300ms cubic-bezier(1, 0, 0, 1);
  transition: all 300ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-checkbox:hover .lever:before{border-color: #c51315;}
.label-checkbox input[type="checkbox"]:checked + .lever{background: #c51315;color: #fff;}
.label-checkbox input[type="checkbox"]:checked + .lever{border-color:#c51315;}
.label-checkbox input[type="checkbox"]:checked + .lever:before{left:100%; margin-left: -44px; border-color: #fff;}

.radio-wrap{}
.label-radio input[type="radio"]{display: none;}
.label-radio{cursor: pointer; color: #828c9a; font-weight: normal;
  letter-spacing: 0;
  display: inline-block;
  position: relative;
  margin-right: 20px;
}
.label-radio .lever:before{
  content:'';
  border: 1px solid #ddd;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  display: inline-block;
  vertical-align: middle;
  border-radius:10px;
  -webkit-transition: all 800ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 800ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 800ms cubic-bezier(1, 0, 0, 1);
  transition: all 800ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-radio input[type="radio"]:checked + .lever:before{
  opacity: 0;
  background: #eee;
  border-color: #eee;
  transform:scale(2);
}
.label-radio .lever:after{
  content:'';
  opacity: 0;
  position: absolute;
  left: 8px;
  top: 0px;
  width:8px;
  height: 16px;
  border-right: 2px solid #ddd;
  border-bottom: 2px solid #ddd;
  transform:rotate(-200deg);
  -webkit-transition: all 400ms cubic-bezier(1, 0, 0, 1);
  -moz-transition: all 400ms cubic-bezier(1, 0, 0, 1);
  -o-transition: all 400ms cubic-bezier(1, 0, 0, 1);
  transition: all 400ms cubic-bezier(1, 0, 0, 1);
  -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -moz-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  -o-transition-timing-function: cubic-bezier(1, 0, 0, 1);
  transition-timing-function: cubic-bezier(1, 0, 0, 1);
}
.label-radio input[type="radio"]:checked + .lever:after{
  opacity: 1;
  position: absolute;
  left: 8px;
  top: 0px;
  width:8px;
  height: 16px;
  border-right: 2px solid #5bc0de;
  border-bottom: 2px solid #5bc0de;
  transform:rotate(40deg);
}



/* ======================================================================================

    other

====================================================================================== */


@media only screen and (min-width:768px) {
	
.pc{display:block;}
.sp{display:none;}


.res10{width:10%;}
.res11{width:11%;}
.res12{width:12%;}
.res13{width:13%;}
.res14{width:14%;}
.res15{width:15%;}
.res16{width:16%;}
.res17{width:17%;}
.res18{width:18%;}
.res19{width:19%;}
.res20{width:20%;}
.res21{width:21%;}
.res22{width:22%;}
.res23{width:23%;}
.res24{width:24%;}
.res25{width:25%;}
.res26{width:26%;}
.res27{width:27%;}
.res28{width:28%;}
.res29{width:29%;}
.res30{width:30%;}
.res31{width:31%;}
.res32{width:32%;}
.res33{width:33%;}
.res34{width:34%;}
.res35{width:35%;}
.res36{width:36%;}
.res37{width:37%;}
.res38{width:38%;}
.res39{width:39%;}
.res40{width:40%;}
.res41{width:41%;}
.res42{width:42%;}
.res43{width:43%;}
.res44{width:44%;}
.res45{width:45%;}
.res46{width:46%;}
.res47{width:47%;}
.res48{width:48%;}
.res49{width:49%;}
.res50{width:50%;}
.res51{width:51%;}
.res52{width:52%;}
.res53{width:53%;}
.res54{width:54%;}
.res55{width:55%;}
.res56{width:56%;}
.res57{width:57%;}
.res58{width:58%;}
.res59{width:59%;}
.res60{width:60%;}
.res61{width:61%;}
.res62{width:62%;}
.res63{width:63%;}
.res65{width:65%;}
.res66{width:66%;}
.res67{width:67%;}
.res68{width:68%;}
.res69{width:69%;}
.res70{width:70%;}
.res71{width:71%;}
.res72{width:72%;}
.res73{width:73%;}
.res74{width:74%;}
.res75{width:75%;}
.res76{width:76%;}
.res77{width:77%;}
.res78{width:78%;}
.res79{width:79%;}
.res80{width:80%;}
.res81{width:81%;}
.res82{width:82%;}
.res83{width:83%;}
.res84{width:84%;}
.res85{width:85%;}
.res86{width:86%;}
.res87{width:87%;}
.res88{width:88%;}
.res89{width:89%;}
.res90{width:90%;}
}



@media only screen and (max-width:767px) {
	
.pc{display:none;}
.sp{display:block;}

.res10,.res11,.res12,.res13,.res14,.res15,.res16,.res17,.res18,.res19,.res20,.res21,.res22,.res23,.res24,.res25,.res26,.res27,.res28,.res29,.res30,.res31,.res32,.res33,.res34,.res35,.res36,.res37,.res38,.res39,.res40,.res41,.res42,.res43,.res44,.res45,.res46,.res47,.res48,.res49,.res50,.res51,.res52,.res53,.res54,.res55,.res56,.res57,.res58,.res59,.res60,.res61,.res62,.res63,.res64,.res65,.res66,.res67,.res68,.res69,.res70,.res71,.res72,.res73,.res74,.res75,.res76,.res77,.res78,.res79,.res80,.res81,.res82,.res83,.res84,.res85,.res86,.res87,.res88,.res89,.res90{width:100%; margin-bottom:10px;}

}



/*--------共通--------*/


.photo_l{float:left; margin:0 10px 10px 0;}
.photo_r{float:right; margin:0 0px 10px 10px;}

.box_l{float:left;}
.box_r{float:right;}
.box_c{margin:0 auto;}

.txt_r{text-align:right;}
.txt_l{text-align:left;}
.txt_c{text-align:center;}

.block{display:block;}
.overflow{overflow:hidden;}
.cl{clear:both;}

.img_b5 img{margin-bottom:5px;}
.img_b10 img{margin-bottom:10px;}

.w10{width:10%;}
.w15{width:15%;}
.w20{width:20%;}
.w25{width:25%;}
.w30{width:30%;}
.w35{width:35%;}
.w40{width:40%;}
.w45{width:45%;}
.w50{width:50%;}
.w55{width:55%;}
.w60{width:60%;}
.w65{width:65%;}
.w70{width:70%;}
.w75{width:75%;}
.w80{width:80%;}
.w85{width:85%;}
.w90{width:90%;}

.mt5{margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt25{margin-top:25px !important;}
.mt30{margin-top:30px !important;}
.mt35{margin-top:35px !important;}
.mt40{margin-top:40px !important;}
.mt45{margin-top:45px !important;}
.mt50{margin-top:50px !important;}

.mb5{margin-bottom:5px !important;}
.mb10{margin-bottom:10px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mb25{margin-bottom:25px !important;}
.mb30{margin-bottom:30px !important;}
.mb35{margin-bottom:35px !important;}
.mb40{margin-bottom:40px !important;}
.mb45{margin-bottom:45px !important;}
.mb50{margin-bottom:50px !important;}

.mtb5{margin:5px 0 !important;}
.mtb10{margin:10px 0 !important;}
.mtb15{margin:15px 0 !important;}
.mtb20{margin:20px 0 !important;}

.ptb5{padding:5px 0 !important;}
.ptb10{padding:10px 0 !important;}
.ptb15{padding:15px 0 !important;}
.ptb20{padding:20px 0 !important;}

.mr3{margin-right:3px !important;}
.mr4{margin-right:4px !important;}
.mr5{margin-right:5px !important;}
.mr6{margin-right:6px !important;}
.mr7{margin-right:7px !important;}
.mr8{margin-right:8px !important;}
.mr9{margin-right:9px !important;}
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}

.f70per{font-size:70%}
.f80per{font-size:80%}
.f90per{font-size:90%}
.f110per{font-size:110%}
.f120per{font-size:120%}
.f130per{font-size:130%}
.f140per{font-size:140%}
.f150per{font-size:150%}
.f160per{font-size:160%}
.f170per{font-size:170%}
.f180per{font-size:180%}




.memo{font-size:85%; line-height: 1.5;}

.movie-wrap {position: relative; padding-bottom: 50%; padding-top: 30px; height: 0; overflow: hidden;}
.movie-wrap iframe {position: absolute; top: 0; left: 0; width:100%; height:100%;}

#page-top{position: fixed; bottom: 30px; right: 30px; z-index:20;}
#page-top{width: 50px; height: 50px; border: #fff solid 0px; border-radius: 500rem; opacity: .5; background: rgba(160,0,0,1)}
#page-top:hover{opacity: 1;}
#page-top::before{content: 'Back'; width: 100%; text-align: center; font-size: .7rem; color: #fff; position: absolute; left: 0; bottom: 5px; margin: auto;}
#page-top::after{
content: "";
position: absolute;
right: 0px;
left: 0px;
width: 0px;
height: 0px;
top: 7px;
margin: auto;
border-style: solid;
border-color: transparent transparent #fff transparent ;
border-width: 0px 6px 10px 6px;}