@charset "utf-8";
/* ===================================================================
CSS information
 file name  :  graduate.css
 style info :  スタイル指定
=================================================================== */
/* 追従する上に戻るボタン */
p.circleUp{
  position: sticky;
  top:93%;
  z-index:10000000;
  font-size: 2rem;
  text-align: right;
  padding-right: 2rem;
  width: 10%;
  margin-left: 90%;
}
/*タイトル下のリード*/
.inner960.graduate p{
margin-top: 60px;
text-align: center;
}

/*各エリア*/
.innerArea{
width: 960px;
margin: 0 auto;
padding: 0;
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
text-align: left;
}
div.coursePro{
margin: 4rem 0 2rem;
}
div.coursePro h3{
margin: 1rem auto;
width: 60%;
font-size: 1.2rem;
}
div.course{
font-size: 0.8rem;
display: flex;
justify-content: center;
width: 80%;
margin: 4rem auto 0;
}
dl.courseMark{width: 50%}
dl.courseMark.pro{width: 50%}
dl.courseMark{
display: flex;
flex-wrap: wrap;
text-align: left;
}
dl.courseMark.pro dt{
width: 40%;
display: block;
}
dl.courseMark.pro dt span{
font-weight: 600;
}
dl.courseMark.pro dd{
width: 60%;
}
dl.courseMark dt{
width: 10%;
display: block;
}
dl.courseMark dd{
width: 90%;
}
.gradute{
width:25%;
padding: 1rem;
}
.snsIcon{
display: flex;
justify-content: flex-start;
width:85%;
margin: 0 15% 0 0;
text-align: left;
}
.snsIcon li{
width:20%;
padding-right: 0.5rem;
}
.snsIcon li img{
width: 100%;
}
h3.name{
line-height: 1;
margin:0.5rem 0;
font-size: 1.1rem;
font-weight: 400;
text-align: left;
}
h3.name span{
font-size: 0.6rem;
}
dl.graduationCourse{
/*padding: 0.5rem 0  0.8rem;*/
margin:0;
padding: 0;
}
dl.graduationCourse dt{
color:#999999;
font-size: 0.8rem;
}
dl.graduationCourse dd {
line-height: 1;
}
span.small{
font-size: 0.8rem;
font-weight: 600;
}
span.a{color: rgba(225,133,179,1.00);}
span.b{color: rgba(84,141,212,1.00);}
span.c{color: rgba(72,166,141,1.00);}
span.d{color: rgba(154,111,211,1.00);}
span.e{color:#ee9c53;}
span.op{color: #2c649b;}
i.fas.fa-graduation-cap,
i.fas.fa-map-marker-alt{
color:#999999;
padding-right: 0.2rem;
}
p.salonPlace{
margin-bottom: 1rem;
color:#999999;
font-size: 0.8rem;
}
p.salonPlace i.fas.fa-map-marker-alt{
padding-right: 0.5rem;
}
/*北海道タイトル背景色*/
#hokkaidoG h2{
width: 70%;
margin: 1rem auto;
padding: 0.5rem;
background-color: #a675b0;
color: #ffffff;
text-align: center;
}

/*東北タイトル背景色*/
#miyagiG h2{
width: 70%;
margin: 1rem auto;
padding: 0.5rem;
background-color: #0774c4;
    color: #ffffff;
    text-align: center;
}
/* 東京タイトル背景色*/
#tokyoG h2,#kanagawaG h2,#chibaG h2,#saitamaG h2,#gunmaG h2,#tochigiG h2,#ibarakiG h2{
width: 70%;
margin: 1rem auto;
padding: 0.5rem;
background-color: #4cbdf4;
    color: #ffffff;
    text-align: center;
}
/* 北陸・中部タイトル背景色*/
#ishikawaG h2,#aichiG h2,#shizuokaG h2,#naganoG h2,#gifuG h2, #fukuiG h2,#nigataG h2,#yamanashiG h2{
width: 70%;
margin: 1rem auto;
padding: 0.5rem;
    background-color: #49c58a;
    color: #ffffff;
        text-align: center;
    }
/* 大阪タイトル背景色*/
#osakaG h2,#kyotoG h2,#shigaG h2,#hyougoG h2,#wakayamaG h2,#mieG h2{
width: 70%;
margin: 1rem auto;
padding: 0.5rem;
    background-color: #b9d329;
    color: #ffffff;
        text-align: center;
    }
	
/* 中国背景色*/
#okayamaG h2,#hiroshimaG h2,#tottoriG h2{
width: 70%;
margin: 1rem auto;
padding: 0.5rem;
    background-color: #f6bd29;
    color: #ffffff;
        text-align: center;
    }
	
/* 四国背景色*/
#kagawaG h2,#kouchiG h2,#ehimeG h2{
width: 70%;
margin: 1rem auto;
padding: 0.5rem;
    background-color: #ff993f;
    color: #ffffff;
        text-align: center;
    }

/* 九州背景色*/
#nagasakiG h2,#fukuokaG h2,#oitaG h2,#okinawaG h2,#kagoshimaG h2{
width: 70%;
margin: 1rem auto;
padding: 0.5rem;
    background-color: #ec6d88;
    color: #ffffff;
        text-align: center;
    }
    #japan-map{
    margin-top:    5rem;
    }
			/* 海外背景色*/	
			#filipinoG h2	{
			width: 70%;
margin: 1rem auto;
padding: 0.5rem;
			background-color: #beae83;
    color: #ffffff;
				text-align: center;
			}
				
				
				/*敬称略*/
				.titlesOmitted{
				text-align: right;
				font-size: 0.8rem;
width: 70%;
margin: 0 auto;
				}
.coursePro p{
font-size: 0.8rem;
margin-top: 2rem;
}
#tokyoG h2,
#osakaG h2,#kyotoG h2,#shigaG h2,#kanagawaG h2,
#chibaG h2,#saitamaG h2,#tochigiG h2,#ishikawaG h2,
#aichiG h2,#shizuokaG h2,#naganoG h2,#gifuG h2,
#hyougoG h2,#nagasakiG h2,#okayamaG h2,#fukuiG h2,
#wakayamaG h2,#hiroshimaG h2,#kouchiG h2 ,#fukuokaG h2,
#miyagiG h2,#hokkaidoG h2,#gunmaG h2,#oitaG h2,#okinawaG h2,
#mieG h2,#kagoshimaG h2,#tottoriG h2,#ibarakiG h2,#nigataG h2,#kagawaG h2,#ehimeG h2,
#yamanashiG h2,#filipinoG h2
{
width: 100%;
display: block;
}
.container01 h2{
text-align: center;
}
.container01 h2::before{
display: none;
}
.container01 h2::after{
display: none;
}



@media screen and (max-width: 979px) {
/*各エリア*/
.innerArea{
width: 100%;
margin: 0;
padding: 0 5%;
}
.gradute{
width:50%;
padding: 0.5rem;
}
#tokyoG h2,
#osakaG h2,#kyotoG h2,#shigaG h2,#kanagawaG h2,
#chibaG h2,#saitamaG h2,#tochigiG h2,#ishikawaG h2,
#aichiG h2,#shizuokaG h2,#naganoG h2,#gifuG h2,
#hyougoG h2,#nagasakiG h2,#okayamaG h2,#fukuiG h2,
#wakayamaG h2,#hiroshimaG h2,#kouchiG h2 ,#fukuokaG h2,#miyagiG h2,
#hokkaidoG h2,#gunmaG h2,#oitaG h2,#okinawaG h2,#mieG h2,
#kagoshimaG h2,#tottoriG h2,#nigataG h2,#kagawaG h2,#ehimeG h2
{width: 100%;}
   #japan-map{
    margin-top:    2rem;
    }
dl.courseMark{
display: flex;
flex-wrap: wrap;
text-align: left;
width:100%;
margin: 1rem 0;
/*height: 120px;*/
}
dl.courseMark{
font-size: 0.8rem;
}
dl.courseMark dt{
width: 10%;
display: block;
}
dl.courseMark dd{
width: 90%;
}
dl.graduationCourse dd {
letter-spacing: -0.1em
}
p.titlesOmitted{
padding-top: 4rem;
}
#osakaG{
padding-top: 4rem;
}
div.coursePro{
margin: 4rem 0 0rem;
}
div.coursePro h3{
margin: 1rem auto;
width: 100%;
font-size: 1.2rem;
}
div.course{
font-size: 0.8rem;
display: block;
justify-content: center;
width: 100%;
margin: 0 auto;
}
dl.courseMark,dl.courseMark.pro{
width: 90%;
margin: 1rem auto 0;
}
dl.courseMark.pro dt{
width: 30%;
display: block;
}
dl.courseMark.pro dd{
width: 70%;
}
.tokyoG h2{
width: 100%;
}
				/*敬称略*/
				.titlesOmitted{
width: 90%;
margin: 0 auto;
				}
.coursePro p{
width: 88%;
margin: 2rem auto 0;

}
}
