@charset "UTF-8";
/*
  Theme Name: SANGO Child Theme
  Template: sango-theme
*/
/* SANGO Customize style.css */

/*--------------------------------
比嘉眼科用
---------------------------------*/


.schedule table {
	width: 100%;
	border-collapse: collapse;
	background: #FFF;
	border-right: solid 1px #b2e9c1;
	font-size: 88%;
	margin-bottom: 5px;
}
	.schedule table th {
		background: #4cbb8c;
		color: #ffffb4;
		text-align: center;
		border-left: solid 1px #b2e9c1; 
		border-bottom: solid 1px #b2e9c1;
		padding: 10px;
	}
	.schedule table td {
		border-left: solid 1px #b2e9c1; 
		border-bottom: solid 1px #b2e9c1;
		padding: 10px;
	}
		.schedule table td.co {
			background: #c5ffd5;
			font-weight: bold;
		}
		.schedule table td.ce {
			text-align: center;
		}
		.schedule table td strong {
		}
		.schedule table td span {
			display: block;
		}

/*--------------------------------
　デバイス分岐
---------------------------------*/

/*【1240px以上】 */
@media only screen and (min-width: 1240px) {
}
/*【1030px以上】 */
@media only screen and (min-width: 1030px) {
}
/*【768px以上】 */
@media screen and (min-width: 768px) {
}
/*【1029px以下】 */
@media only screen and (max-width: 1029px) {
}
/*【767px以下】 */
@media screen and (max-width: 767px) {
}
/*【481px以上】 */
@media screen and (min-width: 481px) {
}


/*--------------------------------------
評価
--------------------------------------*/
.hyouka {
    background: #eceee1;
    border: solid 2px #f3f3f3;
    padding: 5px;
    border-radius: 10px;
}

.hyouka dl {
   margin: 0em 0;
}

.hyouka dt {
	 font-size: 90%;
    background: #b89c58;
    padding: 3px;
    color: #fff;
    font-weight: bold;
    width: 21%;
    text-align: center;
    border: 0;
    margin: 2px 1px;
    float: left;
    border-radius: 10px;
}

.hyouka dd {
	    font-size: 80%;
	color: #333333;
    padding: 3px 5px;
    border: 0;
    float: right;
    width: 77%;
    background: #fff;
    border-radius: 10px;
    margin: 2px 0;
}

.cat-rank-box .hyouka dd {
    width: 33%;
    text-align: center;
    font-weight: bold;
}

.cat-rank-box .hyouka dt {
    width: 63%;
}

.score {
    position: absolute;
    background: url(images/score.png) top right no-repeat;
    color: #fff;
    font-size: 36px;
    font-weight: bold;
    right: 10px;
    bottom: -30px;
    padding: 10px 0 0 10px;
    height: 65px;
    width: 187px;
    text-align: left;
    line-height: 150%;
}

.score span {
    font-size: 16px;
    margin-right: 5px;
}

.FloatEnd {
    clear: both;
    margin: 0;
    padding: 0;
    width: 0;
    height: 0;
}

table.cat-rank-box .hyouka dd span {
    font-size: 11px;
    font-weight: normal;
}

@media only screen and (max-width: 769px) {
.hyouka {
    line-height: 150%;
}

.hyouka dt {
		 font-size: 85%;
    width: 33%;
}

.hyouka dd {
    width: 65%;
}}


/*--------------------------------
　フォントと色
---------------------------------*/
/* 角ゴ*/
body {
    font-family: Roboto, 'Helvetica Neue', Helvetica, sans-serif;
}
/* 全体のカラー */
body {
color:#211a18;
letter-spacing: .03rem;
}

/*--------------------------------
　ヘッダー追尾
---------------------------------*/
@media only screen and (max-width: 767px) {
.header{
position: fixed;
top: 0;
left: 0;	
justify-content: space-between;
transition: .1s;
width: 100%;
height:62px;
}
	
#container{
padding:62px 0 0 0;
}
	
.lpbody #container{
padding:0px 0 0 0!important;
}	
	
.transform #container{
padding:40px 0 0 0;
}
.header.transform{
height:40px;
}

.transform label#drawer__open , .transform .header-search {/*メニュー、サーチボタン*/
font-size: .8em;
height: 40px;
line-height: 40px;
}
.transform #drawer .fa-bars{padding: 0;}
.transform #drawer .fa-bars:after{content:none;}
.transform #logo {height: 40px;line-height: 1.5;}
.transform #logo:before{height:0;}
.transform #logo img{height: 30px;padding: 0;}
.transform #logo a {font-size: .8em;padding: 5px 0 0 0;}
.kjk_fixed_headline {/*sangoサポーター位置調整*/
	top:40px!important;
}
}


/*--------------------------------------
共通
--------------------------------------*/
#inner-content .black-bc {
    background:#211a18;
}

.tbcell .tag {
    position: absolute;
    top: 8px;
    left: 8px;
    line-height: 1;
    z-index: 3;
    font-size: 12px;
    background: #f75065;
    border-radius: 20px;
    color: white;
    font-weight: bold;
    padding: 3px 8px;
    display: inline-block;
    margin-right: 5px;
}

@media (min-width: 1030px) {
.article-header {
    margin: 35px 40px 0px 40px;
}

h1 {
   font-size: 1.7em;
	font-weight:700;
}}

/*--------------------------------------
記事URLコピーボタン
--------------------------------------*/
.copy_main {
	margin: 0 0 2.4em;
}
.copy_btn {
    max-width: 40%;
    margin: 0 auto;
    background-color: #f8f8f8;
    padding: 16px 20px 16px 36px;
    font-size: .875rem;
    font-weight: 700;
    border-radius: 30px;
    position: relative;
    cursor: pointer;
    transition: .1s ease;
}
.copy_btn:hover {
	background: #b5b5b5;
	color: #fff;
}

.copy_btn i:before {
	display: inline-block;
	margin-right: 8px;
	content: '\f0c5';
	font-size: 20px;
	vertical-align: middle;
}
.copy_btn.copied {
	border: solid 1px transparent;
	background: #74d899;
	color: #fff;
	pointer-events: none;
}
.copy_btn.copied i:before {
	content: '\f00c';
}
.copy_btn.not-copied {
	border: solid 1px transparent;
	background: #d87f74;
	color: #fff;
	pointer-events: none;
}
.copy_btn.not-copied i:before {
	content: '\f06a';
}

@media screen and (max-width: 767px) {
.copy_btn {
max-width: 70%;
font-size: 90%;
}}

/*--------------------------------
見出し
---------------------------------*/
/*見出しh1*/
.single-title, .page-title h1 {
    color:#211a18;
}

/*見出しh2*/
.single .entry-content h2 {
    background: #f8f8f8;
    padding: 17px 18px;
    margin: 60px 0 20px;
    font-weight: 700;
    line-height: 1.6;
	font-size: 1.3em;
}

/*トップページを1カラムにしたときの見出しh2*/
.home .entry-content h2 {
    font-weight: 700;
    line-height: 1.6;
	font-size: 1.8em;
}
	
/*見出しh3*/
.single .entry-content h3 {
   font-size: 1.2em;
	border-left: 8px solid #188dc8;
	border-color: #188dc8;
}

/*見出しh4*/
.single .entry-content h4 {
    font-size: 1.1em;
}

/*見出しのスマホ文字サイズ*/
@media screen and (max-width: 767px) {
h1 {
    font-size: 1.2em;
}
	
.single .entry-content h2 {
	font-size: 1.15em;
}

.single .entry-content h3 {
    font-size: 1.12em;
}
.single h4 {
    font-size: 1em;
}
.home h2 {
    font-size: 1.3em;
}
.home h3 {
    font-size: 1.2em;
}
.home h4 {
    font-size: 1.12em;
}}

/*下層ページh1の余白調整*/
@media screen and (max-width: 767px) {
.single-title, .page-title, .entry-title {
    padding: 0px 15px;
}}

/*--------------------------------------
記号
--------------------------------------*/
.maru {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    line-height: 30px;
    text-align: center;
background: #ff8f8f;
font-weight: bold;
}

/*--------------------------------------
見出し（ランキング）
--------------------------------------*/
#inner-content .r01 {
font-weight: bold;
    border-bottom: 1px dotted #d7d7d7;
    padding: 11px 0 1px 60px;
    font-size: 1.4em;
    line-height: 1.5;
    position: relative;
}

#inner-content .r01:before {
    content: " ";
    display: inline-block;
    width: 50px;
    height: 36px;
    background: url(images/r01.jpg);
    background-size: 50px 36px;
    position: absolute;
    top: 3px;
    left: 3px;
}

#inner-content .r02 {
font-weight: bold;
    border-bottom: 1px dotted #d7d7d7;
    padding: 11px 0 1px 60px;
    font-size: 1.4em;
    line-height: 1.5;
    position: relative;
}

#inner-content .r02:before {
    content: " ";
    display: inline-block;
    width: 50px;
    height: 36px;
    background: url(images/r02.jpg);
    background-size: 50px 36px;
    position: absolute;
    top: 3px;
    left: 3px;
}

#inner-content .r03 {
font-weight: bold;
    border-bottom: 1px dotted #d7d7d7;
    padding: 11px 0 1px 60px;
    font-size: 1.4em;
    line-height: 1.5;
    position: relative;
}

#inner-content .r03:before {
    content: " ";
    display: inline-block;
    width: 50px;
    height: 36px;
    background: url(images/r03.jpg);
    background-size: 50px 36px;
    position: absolute;
    top: 3px;
    left: 3px;
}

#inner-content .r04 {
font-weight: bold;
    border-bottom: 1px dotted #d7d7d7;
    padding: 11px 0 1px 60px;
    font-size: 1.4em;
    line-height: 1.5;
    position: relative;
}

#inner-content .r04:before {
    content: " ";
    display: inline-block;
    width: 50px;
    height: 36px;
    background: url(images/r04.jpg);
    background-size: 50px 36px;
    position: absolute;
    top: 3px;
    left: 3px;
}

#inner-content .r05 {
font-weight: bold;
    border-bottom: 1px dotted #d7d7d7;
    padding: 11px 0 1px 60px;
    font-size: 1.4em;
    line-height: 1.5;
    position: relative;
}

#inner-content .r05:before {
    content: " ";
    display: inline-block;
    width: 50px;
    height: 36px;
    background: url(images/r05.jpg);
    background-size: 50px 36px;
    position: absolute;
    top: 3px;
    left: 3px;
}

#inner-content .r06 {
font-weight: bold;
    border-bottom: 1px dotted #d7d7d7;
    padding: 11px 0 1px 60px;
    font-size: 1.4em;
    line-height: 1.5;
    position: relative;
}

#inner-content .r06:before {
    content: " ";
    display: inline-block;
    width: 50px;
    height: 36px;
    background: url(images/r06.jpg);
    background-size: 50px 36px;
    position: absolute;
    top: 3px;
    left: 3px;
}

#inner-content .r07 {
font-weight: bold;
    border-bottom: 1px dotted #d7d7d7;
    padding: 11px 0 1px 60px;
    font-size: 1.4em;
    line-height: 1.5;
    position: relative;
}

#inner-content .r07:before {
    content: " ";
    display: inline-block;
    width: 50px;
    height: 36px;
    background: url(images/r07.jpg);
    background-size: 50px 36px;
    position: absolute;
    top: 3px;
    left: 3px;
}

#inner-content .r08 {
font-weight: bold;
    border-bottom: 1px dotted #d7d7d7;
    padding: 11px 0 1px 60px;
    font-size: 1.4em;
    line-height: 1.5;
    position: relative;
}

#inner-content .r08:before {
    content: " ";
    display: inline-block;
    width: 50px;
    height: 36px;
    background: url(images/r08.jpg);
    background-size: 50px 36px;
    position: absolute;
    top: 3px;
    left: 3px;
}

#inner-content .r09 {
font-weight: bold;
    border-bottom: 1px dotted #d7d7d7;
    padding: 11px 0 1px 60px;
    font-size: 1.4em;
    line-height: 1.5;
    position: relative;
}

#inner-content .r09:before {
    content: " ";
    display: inline-block;
    width: 50px;
    height: 36px;
    background: url(images/r09.jpg);
    background-size: 50px 36px;
    position: absolute;
    top: 3px;
    left: 3px;
}

#inner-content .r10 {
font-weight: bold;
    border-bottom: 1px dotted #d7d7d7;
    padding: 11px 0 1px 60px;
    font-size: 1.4em;
    line-height: 1.5;
    position: relative;
}

#inner-content .r10:before {
    content: " ";
    display: inline-block;
    width: 50px;
    height: 36px;
    background: url(images/r10.jpg);
    background-size: 50px 36px;
    position: absolute;
    top: 3px;
    left: 3px;
}

/*--------------------------------
　ダミー見出し
---------------------------------*/
/* ダミーH3見出し */
.single .dummyh3 {
   font-weight: bold;
   margin: 2.6em 0 0.7em;
   padding: 10px 0 10px 10px;
   font-size: 1.2em;
	border-left: 8px solid #6fb83f;
	border-color: #6fb83f;
}

/* ダミーH4見出し */
.subh1, .subh2 {
margin: 2.3em 0 0.7em;
    line-height: 1.5!important;
    font-size: 1.1em;
    font-weight: 700;
}

/* ダミー見出し */
#inner-content .hh24 {
    color: #211a18;
}

/* 数字入りの見出し */
.notit {
font-weight: 700;
    padding-left: 33px;
    margin: 30px 0 10px;
}

.no {
    margin: 0 0 0 -36px;
    width: 30px;
    height: 30px;
    display: block;
    background-color: #26486d;
    color: #fff;
    text-align: center;
    border-radius: 50px;
	    float: left;
}


.nn {
	width: 30px
}

.nme {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-o-border-radius: 50%;
	-ms-border-radius: 50%;
	font-size: 20px;
	color: #fff;
	background-color: #f89174;
	text-align: center
}

.nme p {
	font-weight: 700;
	position: relative;
	top: 50%;
	font-size: 15px;
	margin: 0;
	transform: translateY(-50%)
}

.tc {
	display: table-cell;
	vertical-align: middle
}

.aut h3{
    border-left: none!important;
    border-color: none!important;
}

/* ショート見出し */
.labelorange {
    background: #d8972d;
}

.labelblue {
    background: #69abcb;
}

.labelred {
    background: #c35649;
}

.labelred, .labelblue, .labelorange {
    display: inline-block;
    padding: 5px 7px;
    line-height: 1;
    vertical-align: middle;
    font-size: .9em;
    border-radius: 5px;
    color: #FFF;
}



/*--------------------------------------
アーカイブページ
--------------------------------------*/
/* 文字の色 */
.sidelong__link {
    color:#211a18;
}

/* タブレットのしたときの文字サイズ */
@media only screen and (max-width: 1029px)  {
.sidelong h2 {
    font-size: 16px;
}}

/* スマホにしたときの文字サイズ */
@media screen and (max-width: 767px) {
.sidelong h2 {
    font-size: 14px;
}}

/*--------------------------------------
フッターの著者
--------------------------------------*/
.postauth {
    text-align: center;
    font-weight: 700;
    background: #fff;
    letter-spacing: .05em;
    padding: 2em 0 .5em;
}

.postauth a {
    color: #48AAE6;
}

.postauth a:hover {
	text-decoration: none;
	color: #fff
}

.vcard-author {
    border: solid 2px #48AAE6;
    padding: 8px 10px;
    border-radius: 5px;
    font-size: .83em;
}

.vcard-author:hover {
	background: #48AAE6
}

/*--------------------------------------
フッター
--------------------------------------*/
/* 背景色をメインカラー以外に変更 */
#footer-menu {
  background-color: #211a18 !important;
}
/* 全体の余白 */
#footer-menu {
  padding: 30px 10px 5px;
}

/* ホームリンクのカラーを調整 */
#footer-menu a {
  color: #fff!important;
  opacity: 0.8;
}

/* フッターのタブ文字 */
.mod_taglist a {
	    font-size: 0.9em;
    display: inline-block;
    background: #eee;
    margin: 7px 2px 0;
    border-radius: 5px;
    box-sizing: border-box;
    height: 28px;
    line-height: 28px;
    padding: 0 14px;
}

/* カテゴリーとタグの色調整 */
.footer-meta ul li a {
    color: #211a18;
}

/* single-specialspecial専用 */
.hm02 {
    padding: 5px 0;
    text-align: center;
    padding-bottom: 2.5em;
}

#footer-menu02 {
    background: #211a18;
	text-align: center;
}

#footer-menu02 .copyright {
	    padding: 5px 0px;
    margin: 0px 0 0;
    text-align: center;
    color: #ffffff;
    font-size: 12px;
	
}

/* コピーライト */
.copyright {
color: #fff!important;
font-size: 12px;
}

/*--------------------------------
　サイドバーランキング【ジロー】
---------------------------------*/
/* カスタムHTMLのランキング */
.show_num li a figure + div {
  padding-left: 5px;
}
.show_num li .rank {
  top: 13px;
  left: 9px;
  border-radius: 0;
}
.my-widget__img img {
  border: solid 2px #f4f4f4;
}


/*--------------------------------
サイドバー
---------------------------------*/
/* ウィジェットタイトル */
.widgettitle {
    font-size: 1.1em;
}

/* ウィジェットのテキスト */
.widget ul li a {
  padding: .4.5em;
  color: #211a18;
}
/* アイコンを非表示 */
.widgettitle:before {
  content: none !important;
}
/* 見出しのマージン下 */
.widget {
  margin: 0 0 2em;
}
/* ホバー */
.widget .my-widget li a:hover {
  background: #f8f8f8;
  color: #888;
  border-radius: 3px;
}
/* カスタムHTMLの余白 */
.my-widget {
  padding: .5em;
}

/*--------------------------------
　画像
---------------------------------*/

/* 画像のマージン下を調整 */
.wp-block-image img {
  margin-bottom: 1em;
}

/*--------------------------------
　画像枠線
---------------------------------*/

/* グレイの枠線 */
.wp-block-image.is-style-sango-with-border img {
  border: solid 2px #e4e4e4;
}

/*--------------------------------
　画像影（小）【ジロー】
---------------------------------*/

/* 画像影のスタイル */
.wp-block-image.is-style-sango-with-shadow {
  margin-top: 1.5em;
  margin-bottom: 1.5em;
  padding: 1.5em 1em .5em;
  background-color: #f5fbff;
}
/* 画像影 */
.wp-block-image.is-style-sango-with-shadow img {
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.15);
}
/*【481px以上】画像影の高さを指定 */
@media screen and (min-width: 481px) {
.wp-block-image.is-style-sango-with-shadow img {
  width: initial;
  max-height: 400px;
 }
}
/*【480px以下】画像影の高さを指定 */
@media screen and (max-width: 767px){
.wp-block-image.is-style-sango-with-shadow img {
  width: initial;
  max-height: 200px;
 }
}
/* キャプション説明文 */
.wp-block-image figcaption {
  margin-top: 0;
  margin-bottom: 0.5em;
  color: #211a18;
  text-align: center;
  font-size: 14px;
}


/*--------------------------------
　目次【ジロー】
---------------------------------*/
#entry .ez-toc-title:before {
    margin: 0px 6px 0px 0;
    top: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: inline-block;
    background: #ffb36b;
    color: #fff;
    font-family: "Font Awesome 5 Free";
    content: "\f0ca";
}

#toc_container .toc_list li a, .ez-toc-list li a {
    color:#211a18;
}

/*【481px以上】余白の設定 */
/* デフォルトのズレを調整（削除予定） */
@media only screen and (min-width: 481px) {
#ez-toc-container {
  margin: 2.5em 0;
  padding: 25px 25px 15px !important;
 }
}
/* 目次全体のスタイル＋カラー変更 */
#ez-toc-container {
    padding: 25px 15px 20px;
font-size: 0.9em;
    background: #f8f8f8;
    border: 3px solid #f1f1f1!important;
    border: solid 1px;
    border-top: none;
    background: #fff;
    margin: 0 0 2em;
	box-shadow: none!important;
}

/* タイトル＋カラー変更 */
.entry-content .ez-toc-title-container {
  padding: 7px 0 5px 15px;
  font-size: 1.25em;
  color: #1ABC9B !important;
}
/* アイコン＋カラー変更 */
.entry-content .ez-toc-title-container:before {
  background: #1ABC9B !important;
}
/* サイドバーハイライトカラー */
.ez-toc-list .active {
  background-color: #f8f8f8;
}

.ez-toc-title-container {
  display: block;
  width: 100%;
}
#ez-toc-container p.ez-toc-title {
  display: block;
  text-align: center;
}

.entry-content .ez-toc-title-container {
    color: #211a18!important;
    font-size: 16px;
    line-height: 42px;
    font-weight: 700;
	 padding: 0px 0px 0px 0px!important;
	 margin: 0px 0px 0px 0px!important;
}

/*--------------------------------
youtubeレスポンシブ対応
---------------------------------*/
.movie-wrap {
     position: relative;
     padding-bottom: 56.25%;
     height: 0;
     overflow: hidden;
}
 
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

/*--------------------------------
　プロフィール【ジロー】
---------------------------------*/
/* この記事を書いた人 */
.author_label span {
  color: #211a18;
  font-size: 1em;
}
/*【1030px以上】仕切り線 */
@media only screen and (min-width: 1030px) {
.author-info__inner .tb-left {
  border-right: solid 2px #efefef;
 }
}
/* プロフィール画像 */
.author_img img {
  border: solid 3px #e4e4e4;
}
/* 運営者名 */
.author-info__inner .tb-left dt a {
  color: #211a18;
}
/* プロフィールテキスト */
.author-info__inner .tb-right {
  padding: 15px 15px;
  font-size: .95em;
  line-height: 1.85;
}


/*--------------------------------
　評価ボックス【ジロー】
---------------------------------*/
/* タイトルをH4見出しのスタイルに揃える */
.rate-title {
  margin: 1.6em 0 1em;
  padding: 8px 0 8px 12px;
  text-align: left;
  font-size: 1.2em;
  line-height: 1.5;
  border-left: solid 4px #adadad;
  color: #211a18;
}
.rate-title:before{
  display: none;
}
/* 【481px以上】中央寄せを解除 */
@media only screen and (min-width: 481px) {
.rate-box {
  max-width: 580px;
  margin: 0 0 2em;
 }
}
/* ボックスのスタイル調整 */
.rate-box {
  margin-bottom: 2em;
  font-size: 1em;
  border: solid 2px #e4e4e4;
}
.rateline {
  padding: 8px 10px 8px 13px;
}
.rate-thing {
  font-weight: normal;
}
/* 背景色 */
.rate-box .rateline:nth-child(even) {
  background: #f8f8f8;
}
.rate-box .rateline:nth-child(odd) {
  background: #fff;
}
/* 星なしの背景色とカッコ内数字 */
.rate-star {
  color: #c8c8c8;
}
/* 星の背景色 */
.rate-star .fa, .rate-star .fa-star-half-alt {
  color: #f4bd1b;
}
/* 総合評価の背景色 */
.rate-box .rateline.end-rate {
  background: #e8f4ff;
}

/*--------------------------------
　404エラーページ【ジロー】
---------------------------------*/
/* 1030px以上のページ */
@media only screen and (min-width: 1030px) {
.wrap {
  width: 1180px;
 }
}
@media (min-width: 1030px) {
.d-5of7 {
  float: left;
  width: 69%;
  padding-right: 0;
 }
}
.nofound-img h2 {
  font-size: 2em;
}

/*--------------------------------
　カラーボックス【ジロー】
---------------------------------*/
/* 全体スタイル */
.meritbox, .noticebox, .demeritbox {
  margin: 2.8em 0 1.5em;
  position: relative;
}

.meritbox .list-raw ul {
    margin: 0px 0!important;
}

.demeritbox .list-raw ul {
    margin: 0px 0!important;
}

/* テキスト */
.meritbox, .noticebox, .demeritbox .box-content {
    padding: 2em 1.5em 1em 1.5em;
}
/* ボックス背景色の設定 */
.meritbox {
  background: #f3f5f6;
}
.noticebox {
  background: #f3f5f6;
}
.demeritbox {
  background: #f3f5f6;
}
/* タイトル */
.meritbox .box-title, .noticebox .box-title, .demeritbox .box-title {
  display: inline-block;
  position: absolute;
  margin: 0;
  padding: 10px 18px 12px 15px;
  top: -20px;
  left: 14px;
  color: #fff;
  font-weight: bold;
  font-size: 1.05em;
  line-height: 1;
  text-align: center;
  border-radius: 50px;
  border: none;
  box-shadow: 0 0 0px 4px #fff;
  z-index: 1;
}
/* タイトルカラーの設定 */
.meritbox .box-title {
  background: #1ABC9B;
}
.noticebox .box-title {
  background: #f4bd1b;
}
.demeritbox .box-title {
  background: #f77777;
}

/* 背景カラーの設定 */

/* アイコン */
.meritbox .box-title:before, .noticebox .box-title:before, .demeritbox .box-title:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 17px;
}
/* アイコン背景 */
.meritbox .box-title:after, .noticebox .box-title:after, .demeritbox .box-title:after {
  position: absolute;
  margin: 5px;
  width: 29px;
  height: 29px;
  top: 0;
  left: 0;
  content: "";
  background: #fff;
  border-radius: 50%;
  z-index: -1;
}
/* アイコンの位置調節 */
.meritbox .box-title:before {
  margin-left: -4px;
  margin-right: 12px;
    content: "\f164";
  color: #1ABC9B;
}
.noticebox .box-title:before {
  margin-left: -2px;
  margin-right: 14px;
  content: "\f15c";
  color: #f4bd1b;
}
.demeritbox .box-title:before {
    margin-left: -3px;
    margin-right: 12px;
  content: "\f165";
  color: #f77777;
}

/* デフォルトmemo */
.memo {
font: 16px/175% "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    color: #211a18;
}

.memo.ttl .memo_ttl:before {
    background: #f4bd1b;
}

.memo_ttl:before {
    background: #ffb36b;
    width: 25px;
    height: 25px;
    line-height: 25px;
}

.fa5 .memo_ttl:before {
    font-size: 12px;
}

.memo.alert {
    font-size: 95%;
}

/* デフォルト注意 */
.memo.alert .memo_ttl {
    color: #f77777;
    font-size: 105%;
}

.memo.alert .memo_ttl:before {
    background: #f77777;
}

/* 角曲げ */
.gbox {
    background: #f3f5f6;
    padding: 10px 15px;
    margin-bottom: 15px;
    position: relative;
}

.gbox:after {
    position: absolute;
    content: '';
    right: 0;
    top: 0;
    border-width: 0 16px 16px 0;
    border-style: solid;
    border-color: #fff #fff #e7e7e7;
    box-shadow: -1px 1px 1px rgba(0,0,0,.15);
}


/*--------------------------------
　アコーディオン【ジロー】
---------------------------------*/

/* 開閉エリアの余白 */
.accordion {
  margin: .5em 0;
  font-size: 1em;
}
/* 全体 */
.accordion label {
  color: #211a18;
  border: solid 2px #e4e4e4;
}
/* ホバー */
.accordion label:hover {
  background :#f8f8f8;
}
/* 開いたタイトルエリアの背景色 */
.accordion_input:checked + label {
  background: #f4f4f4;
}
/* 開いたテキストエリアの余白 */
.accordion_input:checked ~ .accordion_content {
  padding: 1em 0 0.5em;
}

/*--------------------------------------
  開閉ボタン【ジロー】
--------------------------------------*/

/* アコーディオンの別スタイル */
.opener {
  margin: 1.5em 0;
  font-size: 1em;
}
.opener label {
  display: inline-block;
  position: relative;
  padding: 10px 18px 10px 34px;
  text-align: left;
  font-weight: bold;
  color: #211a18;
  background: #f6f6f6;
  border: none;
  cursor: pointer;
  transition: 0.3s;
  border-radius: 3px;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
}
.opener label:after {
  position: absolute;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f067";
  right: auto;
  left: 12px;
  top: 17px;
  top: calc(50% - 7px);
  line-height: 15px;
  font-size: 15px;
  color: #c8c8c8;
}
.opener label:hover {
  background: #f8f8f8;
}
.opener_input {
  display: none;
}
.opener_content {
  height: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  transition: 0.8s;
}
.opener_input:checked ~ .opener_content {
  height: auto;
  padding: 1em 0 0.5em;
  opacity: 1;
  overflow: visible;
}
.opener_input:checked + label {
  background: #f8f8f8
}
.opener_input:checked + label:after {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f068";
}


/*--------------------------------------
ヘッダーお知らせ欄
--------------------------------------*/
.header-info a {
    padding: 5px;
    font-size: 15px;
}
.header-info a:after {
    content: "クリックして見に行く";
    font-weight: 500;
    border: 1px solid #FDD835;
    border-radius: 5px;
    padding: 2px 10px;
    margin-left: 5px;
    background: #FDD835;
    color: #211a18;
}
@media screen and (max-width: 500px){
.header-info a:after {
    display: block;
    width: 60%;
    content: "タップして見に行く";
    margin: 0 auto;
    font-size: .8em;
}}

/*--------------------------------
　引用
---------------------------------*/

/* 全体のスタイル */
.entry-content .wp-block-quote {
  box-sizing: border-box;
  position: relative;
  margin: 2em 0 1.5em;
  padding: 40px 10px 10px 15px;
  border : 0;
  border-left : solid 4px #d6edff;
  background: #fbfbfb;
  color: #484848;
}
/* アイコン */
.entry-content .wp-block-quote:before{
  display: inline-block;
  position: absolute;
  top: 15px;
  left: 15px;
  font-family: FontAwesome;
  font-size: 20px;
  vertical-align: middle;
  line-height: 1;
  content: "\f10d";
}
/* テキスト */
.entry-content .wp-block-quote p {
  margin: 10px 0;
  padding: 0;
  line-height: 1.85;
  font-size: 1em;
}
/* 引用元 */
.entry-content .wp-block-quote cite {
	  font-style: normal;
  display: block;
  color: #888;
  font-size: 0.9em;
  text-align: right;
}

.entry-content blockquote cite {
    right: 20px;
    bottom: 10px;
    color: gray;
}

.entry-content blockquote cite a {
    border-bottom: none!important;
}


/*--------------------------------
　タイムライン
---------------------------------*/

/* マージン上下の余白 */
.entry-content .tl {
  margin: 1em 0 .5em;
}
/* 全体のスタイル */
.tl_content {
  position: relative;
  padding: 0 0 1.5em 1.8em;
}
/* ステップの縦ライン */
.tl-content:before {
  background: #dcdcdc;
}
/* ステップ */
.tl_label {
  padding-top: 1px;
  color: #a4a4a4;
  font-size: .85em;
}
/* タイトル */
.tl_title {
  color: #211a18;
}
/* 説明文テキスト */
.tl_main {
  font-size: 1em;
  line-height: 1.7;
  margin-top: .4em;
  padding: 0 0 1.5em;
  border-bottom: dashed 1px #d4d4d4;
}

/*--------------------------------------
角丸
--------------------------------------*/
#entry {
    border-radius: 10px;
}

@media screen and (max-width: 450px) {
#entry {
    border-radius: 0px;
}}

/*--------------------------------------
カテゴリーページ
--------------------------------------*/

/* トップページのカテゴリー一覧デザイン */
.c-category-listno a:hover{
opacity:.6;
text-decoration: none;
}

.c-category-card__items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 20px;
}

.c-category-card__items ul {
    list-style: none;
    list-style-image: none;
}

.c-category-card__item {
    display: block;
    width: 48%;
    height: 106px;
    margin: 15px 0 0 10px;
    border: 1px solid #eee;
    text-align: center;
}

.c-category-listno ul {
    border: none;
    box-shadow: none;
    background: transparent;
}

.entry-content .c-category-listno li {
    padding: 0px 0;
}
.entry-content .c-category-listno ul {
    margin-bottom: 0em;
    padding: 0em 0em 0em 0em;
}

.c-category-card__item__link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
    padding: 10px;
    color:#211a18;
    font-size: 14px;
    line-height: 1.5;
}

.c-category-card__item:before {
    right: -3px;
    bottom: -12px;
    border-width: 17px 0 17px 17px;
    border-color: transparent transparent transparent #eee;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.c-category-card__item:before {
    content: "";
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    margin: auto;
    border-style: solid;
}

@media (max-width: 769px) {
.c-category-card__item:nth-of-type(2n-1) {
    margin-left: 0;
}}

@media (min-width: 769px) {
.c-category-card__item:nth-of-type(4n-3) {
    margin-left: 0;
}

.c-category-card__item {
    width: 23%;
    height: 100px;
    margin: 0 0 30px 30px;
}

.c-category-card__item__link {
    font-size: 16px;
}

.c-category-card__item__icon {
    width: 40px;
    height: 40px;
}

}

/* タイトル */
#archive_header h1 {
  margin: .5em 0;
  font-size: 1.2em;
  line-height: 1.5em;
  color: #211a18;
}

/* カテゴリーに枠をつける*/
.post-categories a {
    font-size: 0.75em;
    border: 2px solid #a9a9a9;
    text-decoration: none;
    background: #fff;
    opacity: .75;
    padding: 5px;
    margin-right: 5px;
}

.post-categories a:before {
	    font-weight: 900;
    padding-right: 5px;
    font-family: "Font Awesome 5 Free";
    content: "\f02b";
}

.category-post-title {
    text-align: center;
    color: #525252;
    font-size: 27px;
    margin-top: 20px;
}

h1.category-post-title .sml {
    display: block;
    font-size: 15px;
}

.headimggg {
    max-width: 600px;
    margin: 0 auto;
}

.category-description {
	padding: 0px 20px;
margin-top:20px;
	font-weight: bold;
	font-size:15px;
}
.category-wrap {
    margin-left: auto;
    margin-right: auto;
	    width: 800px;
	    box-sizing: border-box;
    margin: 0 auto;
}

@media screen and (max-width: 991px) {
.category-wrap {
    width: 750px;
}}

@media screen and (max-width: 767px) {
.category-wrap {
    width: 590px;
}}

@media screen and (max-width: 768px) {
.category-wrap {
    width: 100%;
}}

@media screen and (max-width: 450px) {
#main .category-wrap {
    padding: 0 10px 20px;
}}

.main-inner {
    margin-left: auto;
    margin-right: auto;
}

.category-wrap {
    margin-left: auto;
    margin-right: auto;
}

.namih2 {
    text-align: center;
    font-size: 25px;
    font-weight: bold;
    color: #211a18;
    margin-bottom: 20px;
    margin-top: 35px;
    background-size: 50px 10px;
}


/*--------------------------------------
関連記事を２列や3列にする
--------------------------------------*/
/* 2列*/
.post-loop-wrap {
    float: left;
    width: 100%;
}

.post-loop-wrap .linkto {
    float: left;
    max-width: 48%!important;
    margin: 0 1% 17px 1%;
}

@media screen and (max-width: 768px) {
.post-loop-wrap .linkto {
    float: none!important;
    max-width: none!important;
}}

/* 3列*/
.post-loop-wrap3 {
    float: left;
    width: 100%;
}

.post-loop-wrap3 .linkto {
    float: left;
    max-width: 31%!important;
    margin: 0 1% 17px 1%;
}

@media screen and (max-width: 768px) {
.post-loop-wrap3 .linkto {
    float: none!important;
    max-width: none!important;
}}

/*--------------------------------------
吹き出し
--------------------------------------*/
.fukidashi {
    margin-top: 16px;
}

.fukidashi .tit {
    text-align: left;
    font-weight: bold;
    font-size: 17px;
    background: url(images/mayu.png) no-repeat left;
    background-size: contain;
    padding: 20px 0 15px 120px;
    position: relative;
    bottom: -15px;
    margin: 0px;
    background-position: left 30px center;
    border: none;
}

.fukidashi .inner {
    margin-top: 0;
    background: #f8f8f8;
    padding: 30px 40px 24px;
    border-radius: 10px;
}

.sc {
    border-radius: 7px;
}

@media screen and (max-width: 768px) {
.chatting{
    font-size: 0.875em;
}
.fukidashi .inner {
    margin-top: 0;
    background: #f5f5f5;
    padding: 20px;
}
.fukidashi .tit {
    background-image: url(images/mayu.png);
    background-position: left center;
    background-size: contain;
    padding: 15px 0 10px 70px;
    bottom: -15px;
    line-height: 1.6;
}
}

/*--------------------------------------
  吹き出し下
--------------------------------------*/
.saysprp .faceicon span {
    position: absolute;
    top: 40px;
    left: 120px;
    font-size: 14px;
}

.saysprp {
    position: relative;
    width: 100%;
    margin: 1.5em 0;
    overflow: hidden;
}
.saysprp .faceicon {
    padding-right:0;
}

.saysprp .faceicon img {
    width: 100px;
    border-radius: 50%;
    border: none;
}
.saysprp .fuki {
    background-color: #fff;
    border: 1px solid #dbdbdb;
    position: relative;
    margin:.5em .5em 1.5em .5em;
    padding: 1em;
    font-size: 95%;
    width: 98%;
}

.saysprp .fuki:before {
border: 10px solid transparent;
    border-bottom-color: #fff;
    border-top-width: 0;
    top: -9px;
    content: "";
    display: block;
    left: 35px;
    position: absolute;
    width: 0;
    z-index: 1;
}

.saysprp .fuki:after {
    border: 10px solid transparent;
    border-bottom-color: #dbdbdb;
    border-top-width: 0;
    top: -11px;
    content: "";
    display: block;
    left: 35px;
    position: absolute;
    width: 0;
}
@media only screen and (min-width: 481px) {
    .saysprp .faceicon {
        width: 110px;
    }
}
@media only screen and (max-width: 480px) {
    .saysprp .faceicon {
        width: 80px;
    }
    .saysprp .fuki {
        margin:1em 0 1.5em 0;
    }
.saysprp .faceicon span {
    top: 30px;
    left: 90px;
}
}

/*--------------------------------------
関連記事タイトルデザイン【サイト別】
--------------------------------------*/
#main .h-undeline {
    margin-top: 20px;
    background: #ffffff;
}

#main .h-undeline:before {
    background: #ff8376;
    font-family: "Font Awesome 5 Free" !important;
    content: "\f15c";
    display: inline-block;
    width: 35px;
    height: 35px;
    margin: 0 5px 0 0;
    border-radius: 50%;
    color: #fff;
}

/*--------------------------------------
テーブル【サイト別】
--------------------------------------*/
.newline {
white-space: nowrap;
}

.entry-content table {
    border: 2px #ddd solid;
}

/*その他テーブル*/
.inlinemax {
	    font-size: 14px;
    width: 100%;
    margin: 20px 0px;
}

.inlinemax th {
		    font-weight: 700;
    padding: 5px;
    border: 1px solid #ddd;
    text-align: left;
background: #f3fcff;
}

.inlinemax thead th {
	font-size: 13px;
    text-align: center;
	 font-weight: 700;
}

.inlinemax td {
	background-color: #ffffff;
    padding: 7px;
    border: 1px solid #ddd;
    text-align: center;
}

@media screen and (max-width: 768px) {
.inlinemax thead th {
	font-size: 12px;
}}



/*狭いテーブルセンター*/
.inline {
	    font-size: 14px;
    width: 100%;
    margin: 20px 0px;
}

.inline th {
		    font-weight: 700;
    padding: 8px 10px;
    border: 1px solid #ddd;
    text-align: left;
background: #f3fcff;
}

.inline thead th {
    text-align: center;
	    font-weight: 700;
}

.inline td {
	background-color: #ffffff;
    padding: 7px;
    border: 1px solid #ddd;
    text-align: center;
}

/*狭いテーブルノーマル*/
.inlinenormal {
	    font-size: 14px;
    width: 100%;
    margin: 20px 0px;
}

.inlinenormal th {
		    font-weight: 700;
    padding: 8px 10px;
    border: 1px solid #ddd;
    text-align: left;
background: #f3fcff;
}

.inlinenormal thead th {
    text-align: center;
	    font-weight: 700;
}

.inlinenormal td {
    padding: 7px;
	    background-color: #ffffff;
    border: 1px solid #ddd;
}

/*レスポンシブテーブル*/
.tb-responsive {
		    font-size: 14px;
    width: 100%;
    margin: 20px 0px;
}

.tb-responsive th {
    padding: 7px 10px;
    border: 1px solid #ddd;
font-weight: 700;
    text-align: left;
background: #f3fcff;
}

.tb-responsive thead th {
    text-align: center;
	    font-weight: 700;
}

.tb-responsive td {
    padding: 7px 10px;
    border: 1px solid #ddd;
    text-align: center;
}


.ccc-sticky-table:after {
    position: absolute;
    display: block;
    content: "";
    right: -10px;
    top: 0;
    width: 10px;
    height: 100%;
    z-index: 99;
    background: -moz-linear-gradient(left,rgba(0,0,0,.08) 0,transparent 100%);
    background: -webkit-gradient(linear,left top,right top,color-stop(0,rgba(0,0,0,.08)),color-stop(100%,transparent));
    background: -webkit-linear-gradient(left,rgba(0,0,0,.08) 0,transparent 100%);
    background: -o-linear-gradient(left,rgba(0,0,0,.08) 0,transparent 100%);
    background: -ms-linear-gradient(left,rgba(0,0,0,.08) 0,transparent 100%);
    background: linear-gradient(to right,rgba(0,0,0,.08) 0,transparent 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#14000000', endColorstr='#211a1800', GradientType=1 );
}

/*固定*/
.sticky {
    position: sticky!important;
    position: -webkit-sticky;
}


/*広いテーブル*/
.outline {
    width: 100%;
    font-size: 14px;
}

.outline th {
    padding: 20px;
background: #f3fcff;
    border: 2px solid #ddd;
    vertical-align: top;
    font-weight: 700;
    text-align: left;
}

.outline td {
	    border-right: none;
    padding: 20px;
    border: 2px solid #ddd;
    vertical-align: top;
}

@media screen and (max-width: 768px) {
.outline {
    width: 100%;
    font-size: 14px;
	border: none!important;
}
	
.outline tr {
  border: none!important;
}

.outline th {
	    font-size: 16px;
    display: block;
    width: auto;
    padding: 10px 0 2px;
    border: none;
    background: none;
    font-weight: bold;
}

.outline td {
    display: block;
    padding: 0px;
    border: none;
    vertical-align: top;
}
	}


/*--------------------------------------
その他
--------------------------------------*/
.reference {
    color:#211a18;
}

/*--------------------------------------
改行
--------------------------------------*/
.br::before {
	content: "\A" ;
	white-space: pre ;
}

/*--------------------------------------
パンくず
--------------------------------------*/
#breadcrumb li a {
    font-size: 1em;
	 color: #777777;
}

/* 【767px以下】パンくずのスタイル */
@media only screen and (max-width: 767px) {
#breadcrumb {
  font-size: 0.8em;
  padding: 3px 15px;
  background: #f8f8f8;
 }
}

/* ホームアイコン */
#breadcrumb li:first-child a:before {
  padding-right: 4px;
  font-family: FontAwesome;
  font-size: .95em;
  font-weight: normal;
  content: "\f015";
}
/* ナビアイコン */
#breadcrumb li:after {
  padding: 0 4px;
  color:#211a18;
  font-family: FontAwesome;
  content: "\f054";
  font-size: .7em;
}

/*フッダーのパンくず1*/
.customize-pankuzu #breadcrumb {
	    background: #211a18;
    overflow: hidden;
    font-size: 14px;
    padding: 15px 3px;
    line-height: 22px;
    border-bottom: solid 1px rgba(255,255,255,0.33);
}

.customize-pankuzu #breadcrumb li:after {
    color: #FFF;
}

.customize-pankuzu #breadcrumb a {
    color: #FFF;
	    padding: 0 0 0 4px;
	    font: inherit;
    font-size: 100%;
    font-weight: 700;
}

.category-pankuzu #breadcrumb {
    background: #ee8d72;
    padding: 8px 11px;
    font-size: 12px;
    margin: 0;
    color: #FFF;
}

.category-pankuzu #breadcrumb a {
    color: #FFF;
	    padding: 0 0 0 4px;
	    font: inherit;
    font-size: 100%;
    font-weight: 700;
}

/*フッダーのパンくず2*/
.single-special-pankuzu #breadcrumb {
    color: #fff;
    font-weight: 700;
    margin: 0;
    overflow: hidden;
    line-height: 22px;
    background: #63a5ff;
    padding: 15px 10px;
    text-align: center;
}

.single-special-pankuzu #breadcrumb a {
    text-decoration: none;
    color: #fff;
    padding: 0 4px;
}

/*--------------------------------------
single-special
--------------------------------------*/
.hm {
    background: #f4f4f4!important;
    padding: 5px 0;
    text-align: center;
    padding-bottom: 2.5em;
}

.hm a{
	    text-decoration: none;
	}

.btncircle {
    background: #f77777;
    text-align: center;
    border-radius: 50%;
    transition: .3s;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.12), 0 2px 2px 0 rgba(0,0,0,.24);
    display: inline-block;
    text-decoration: none;
    color: #fff;
    width: 70px;
    font-size: 18px;
    height: 70px;
    line-height: 70px;
}


.categoryid-18 .one-column  {
    background: #d0e4ff!important;
}

.categoryid-18 .one-column #main {
    margin: 60px auto 0!important;
}

@media screen and (max-width: 991px){
.categoryid-18 .one-column #main {
    max-width: 1000px;
    margin: 0 auto 0!important;
}
}

@media only screen and (min-width: 768px){
.categoryid-18 .one-column #main {
    max-width: 1000px;
}}

/*--------------------------------------
タイトル左右わっしょい
--------------------------------------*/
.title-light-right:before {
    height: 90%;
    bottom: 2px;
    border-color: #5fb2f6;
}

.title-light-right:after {
    height: 90%;
    bottom: 2px;
    border-color: #5fb2f6;
}

.title-light-right {
    font-weight: bold;
    margin: 10px 0;
    padding: 0 45px;
    text-align: center;
    font-size: 16px;
    color: #db4a39;
    line-height: 1.3;
}

/*--------------------------------------
外部リンク
--------------------------------------*/
.withimg a {
    text-decoration: none;
}

.withimg img {
	    vertical-align: middle;
    width: 100%;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}

.withimg .snk {
    width: 15%;
    max-width: 250px;
    background: #211a18;
}

@media (max-width:767px){
.withimg .ttl {
    font-size: 0.85em;
}
.withimg .snk {
	 width: 25%;
}}

.withimg .ttl {
	font-weight: bold;
    color: #211a18;
}

.bl .tb {
    min-height: 72px;
    text-align: left;
}

.snk {
    color: #807171;
    display: table-cell;
    vertical-align: middle;
    width: 70px;
    font-weight: bold;
    text-align: center;
    background: #f0ebeb;
}

.lnk {
    background: white;
    width: calc(100% - 55px);
    border: none;
    display: table-cell;
    vertical-align: middle;
}

.lnk {
    min-width: 200px;
    display: table-cell;
    border: solid 2px #f0ebeb;
    padding: .7em .5em;
}

.dtl {
    font-size: .75em;
    line-height: 1.5;
    color: #545454;
}

.bl a {
text-decoration: none;
}

.lnk:hover {
	text-decoration: none;
	background: #f7f7f7
}


/*--------------------------------------
ボックス
--------------------------------------*/
.box6 {
    margin: 2em 0;
    padding: 1.5em 1em;
    border: #ddd solid 3px;
    background: #ffffff;
}


.box28 .box-title {
    background: #5fb2f6;
}

.box28 .box-content {
    border: solid 3px #5fb2f6;
}

.box3 {
    font-size: 95%;
    font-weight: 700;
    background: #fff9e5;
}

.box26 {
    border: solid 2px #424242;
    border-radius: 3px;
    margin-top: 1em;
    margin-bottom: 2em;
	    border: solid 1px #211a18;
    border-radius: 2px;
}

.box26 .box-title {
    font-weight: bold;
    color: #211a18;
    font-size: 100%;
    background: white;
    top: -.5em;
	left: 0px;
    line-height: 1.5;
    margin-left: .5em;
}

.box26 .box-content {
    padding: 0 1em 24px;
}

.box26 .box-content {
    font-size: 95%;
}

.li-pastelbc ul {
    margin: 0.6px 10px 0em 0em;
}

.pagination a:hover, .li-pastelbc ul, .li-pastelbc ol {
    background: #ffffff!important;
}

.li-pastelbc ul, .li-pastelbc ol {
    border-color: #211a18!important;
}

/*--------------------------------------
リンク下線
--------------------------------------*/
.entry-content p a {
    padding-bottom: .17em;
    border-bottom: 1px dashed;
    text-decoration: none;
}

.entry-content a:hover {
    color: #3367d6;
}

/*--------------------------------------
CV
--------------------------------------*/
/* CV用の見出し*/
.cvtitle {
	    border-bottom: solid 3px black;
	    color: #ec0012;
	    text-align: center;
    margin: 2.5em 0 .7em;
    font-size: 1.4em;
    line-height: 1.6;
	    font-weight: bold;
}

@media screen and (max-width: 680px){
.cvtitle {
    font-size: 1.2em;
}}

/*背景いっぱい */
.bg-max{
    background: #fefed7;
    box-shadow: 0 0px 0 15px #fefed7;
    margin: 30px 0;
}

@media only screen and (min-width: 1030px){
.bg-max{
    background: #fefed7;
    box-shadow: 0 0px 0 40px #fefed7;
    margin: 100px 0;
}}


/*--------------------------------------
メニュー
--------------------------------------*/
#drawer .fa-bars:after {
    content: 'MENU';
    font-size: 10px;
    font-weight: 700;
    display: block;
    margin-top: 3.5px;
}

#drawer .fa-bars {
    padding: 15px 0 0 12px;
}


/*--------------------------------------
関連記事のふきだし
--------------------------------------*/
.kanrenfuki-main {
	 font-size: .9em;
    display: inline-block;
    position: relative;
    background: rgb(66,66,66);
    color: white;
    font-weight: 500;
    margin: .5em 0;
    border-radius: 25px;
    padding: .1em .8em;
}
.kanrenfuki-main:before {
    position: absolute;
    content: "";
    bottom: -.5em;
    left: 2.5em;
    border-top: 10px solid rgb(66,66,66);
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
}

@media only screen and (max-width: 769px) {
.kanrenfuki-main {
    font-size: .8em;
    padding: .2em .9em;
}
}


/*--------------------------------------
  公式サイト
--------------------------------------*/
.reference2 {
    display: table;
    max-width: 450px;
    width: 100%;
    margin: 1em 0 1.5em;
    padding: 13px 10px 13px 0;
    border-radius: 2px;
    background: #f5f5f5;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.25);
    color: rgba(0,0,0,0.8);
    font-weight: bold;
    text-decoration: none !important;
}

.reference2 {
    width: 60%;
    background: #fff;
    box-shadow: none;
    border: 1px solid #ddd;
    padding: 0px;
    position: relative;
}

.reference2 .refttl {
	    background: #f0ebeb;
font-size: 0.9em;
    width: 70px;
    height: 70px;
    margin: 10px;
    text-align: center;
}

.reference2 .refcite {
    padding-left: 15px;
    line-height: 1.8;
}

.reference2 .refcite {
    padding-left: 10px;
    font-size: 0.95em;
}

.reference2 .refcite span {
	 display: block;
    color: rgba(66,66,66,0.38);
    font-size: .85em;
}

@media screen and (max-width: 500px){
.reference2 {
    width: 100%;
}
.reference2 .refcite {
    padding-left: 10px;
    font-size: 90%;
}}


/*--------------------------------------
参考リンク
--------------------------------------*/
.reference:hover {
  box-shadow: none;
  color: none;
  text-decoration: none;
}

.reference {
    width: 80%;
    background: #fff;
    box-shadow: none;
    border: 1px solid #ddd;
    padding: 0px;
    position: relative;
}

.reference .refttl {
	    font-size: .9em;
    width: 60px;
    border-right: none;
    background: rgba(66,66,66,0.2);
    padding: 6px;
}
.reference .refcite {
    padding-left: 15px;
    line-height: 1.8;
}
.reference .refcite span {
    color: rgba(66,66,66,0.38);
    font-size: .95em;
}
@media screen and (max-width: 500px){
.reference {
    width: 100%;
}
.reference .refcite {
    padding-left: 10px;
    font-size: 90%;
}}
.reference:hover {
    box-shadow: none;
    color: rgba(66,66,66,0.87);
    background: rgba(66,66,66,0.07);
}

/*--------------------------------------
改行
--------------------------------------*/
@media screen and (min-width: 650px){	
  .br-pc { display:block; }
  .br-sp { display:none; }
}
@media screen and (max-width: 650px){	
  .br-pc { display:none; }
  .br-sp { display:block; }
}

/*--------------------------------------
ランディングページ（lp）
--------------------------------------*/
#lp-main .sns-dif ul{
    background: #46526b;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow: hidden;
}

#lp-header.cat-header {
    border: none;
    width: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 650px;
}

#lp-header {
    position: relative;
	    background: #fff;
    padding: 13px 0 4px;
    border-bottom: 1px solid #f0ebeb;
    text-align: center;
}

#lp-header .wrap {
    text-align: left;
}

#lp-header .wrap {
    width: 1140px;
    box-sizing: border-box;
    margin: 0 auto;
    *zoom: 1;
}

#lp-header .wrap .title1st {
    text-align: left;
}

#lp-header .wrap:after {
    content: "";
    display: block;
    clear: both;
}

#lp-header .title1st {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.special {
    background: #FFC107;
    padding: 6px 10px;
    line-height: 1;
    display: inline-block;
    font-weight: bold;
    color: white;
    border-radius: 6px;
}

.cat-header .post-title {
    font-size: 31px;
    line-height: 1.4em;
    color: #595a5a;
    font-weight: 600;
    font-family: Montserrat,YuGothic,'Yu Gothic','ヒラギノ角ゴシック','Hiragino Sans',sans-serif;
}

#lp-post {
    margin: 0 auto;
    background: white;
}

.bluebox {
    background: #bde2eb;
    padding: 2em 1em;
}

.hajimeni {
    display: table;
    margin: 0 auto;
    max-width: 900px;
}

.table-c {
    display: table-cell;
    vertical-align: middle;
}

.eyecatch {
    width: 60%;
}

.bluebox h2 {
    text-align: left;
    font-size: 2em;
    font-weight: bold;
}

.bluebox h3 {
    font-size: 1.5em;
    font-weight: bold;
    padding: 5px 5px 5px 10px;
    border-left: solid 8px #4db6ac;
    margin-bottom: 1em;
    margin-top: 2em;
}

.bluebox p {
    font-weight: bold;
    text-align: justify;
    text-justify: inter-ideograph;
    color: black;
}

.silverbox {
    background: white;
    width: 100%;
}

.boxbox {
    max-width: 900px;
    margin: 0 auto;
    padding: 2em 1em;
}

.boxbox h2 {
    font-size: 1.5em;
    font-weight: bold;
    text-align: center;
    line-height: 1.4em;
    margin-top: 1em;
    margin-bottom: 0.6em;
}

.boxbox h3 {
    font-size: 1.5em;
    font-weight: bold;
    padding: 5px 5px 5px 10px;
    border-left: solid 8px #4db6ac;
    margin-bottom: 1em;
    margin-top: 2em;
}

.boxbox p {
    margin-bottom: 2em;
    border-top: solid 2px #4e4e4e;
    padding-top: 0.5em;
}

.graybox {
    background: #d9f2f8;
}

#lp-content {
    border: none;
}

#lp-content .lp-wrap {
    width: 100%;
    margin: 0;
}

#lp-main {
    width: 100%;
    float: left;
}

.main-inner {
    margin-right: 0;
}

@media screen and (max-width: 768px) {
.table-c, .hajimeni {
    display: block;
    width: 100%;
}
.boxbox h2 {
    font-size: 1.36em;
    margin: 0.6em 0 0.3em;
}
}

@media screen and (max-width: 768px) {
#lp-header.cat-header {
    height: 350px;
}
	
#lp-header .wrap {
    text-align: center;
    padding: 0 18px;
}
	.cat-header .post-title {
    font-size: 22px!important;
    text-shadow: 0 0 4px white;
}
.special {
    font-size: 13px;
}
}

@media screen and (max-width: 1200px) {
#lp-header .wrap {
    margin-left: 30px;
    margin-right: 30px;
    width: auto;
}
	}

/*--------------------------------------
ランキング専用ページ
--------------------------------------*/
#ranking {
    background-color: #ffffff;
}
.read {
	margin: 1em 0;
	text-align: center;
	padding-bottom: 1em;
}
.read p {
	background: #85c7ff;
	color: #FFF;
	margin: 0 0 15px!important;
	font-weight: bold;
	padding: 10px 15px 9px;
	position: relative;
}
.read p:before {
	content: "";
	position: absolute;
	top: -29px;
	left: 50%;
	margin-left: -15px;
	border: 15px solid transparent;
	border-bottom: 15px solid #84c7ff;
}
.read>a {
	color: #FFF;
	text-decoration: none;
	display: inline-block;
	padding: 10px 12px;
	line-height: 1;
	letter-spacing: .5px;
	margin: 0 1px 0 13px;
	background: #ffc57d;
	border-radius: 3px;
	box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .23);
	transition: .3s ease-in-out;
}
.apps {
	display: inline-block;
	text-align: left;
	padding: 0 10px 10px;
	line-height: 1.5;
}
.read>a:hover {
	box-shadow: none;
}

@media screen and (max-width:767px) {
	.read p {
		display: block;
		padding: 5px;
	}
	.read {
		margin: 2em 15px;
		padding-bottom: .1em;
	}
	.read>a {
		padding: 9px 14px;
		margin: 0 8px 15px 8px;
		font-weight: bolder;
	}
}

#ranking #header .wrap {
	padding-top: 7px
}
nav#bread {
	background: #4886ff;
	margin: 0
}
#ranking nav#bread, #ranking .footer-02 {
	background: #211a18
}
.breadcrumb {
	overflow: hidden;
	font-size: 14px;
	padding: 15px 3px;
	line-height: 22px;
	border-bottom: solid 1px rgba(255, 255, 255, 0.33)
}
.breadcrumb .fa {
	color: rgba(255, 255, 255, 0.56)
}
.breadcrumb .fa-map-marker {
	display: none
}
.breadcrumb li {
	float: left;
	margin-left: 2px
}
.breadcrumb li a {
	text-decoration: none;
	color: rgba(255, 255, 255, 0.56);
}
.breadcrumb li:last-child a {
	color: #FFF
}
.breadcrumb li a:hover {
	text-decoration: underline
}
.post-thumbnail img {
	max-width: 100%;
	width: 100%;
	height: auto
}
#headertitle {
	background: #fbe7b2;
	padding: 30px 0 70px
}
.hajimeni {
	display: table;
	width: 100%;
	margin: 0 auto;
	max-width: 767px
}
.table-c {
	display: table-cell;
	vertical-align: middle
}
.table-left {
	width: 400px
}
.table-right {
	width: 367px
}
.table-right p {
	font-weight: bold;
	font-size: 18px
}
.descrr {
	position: relative;
	line-height: 1.8;
	padding: 10px 20px 20px;
	max-width: 824px;
	margin: -60px auto 2.5em;
	background: #d7e6ff
}
#ranking .descrr {
	background: #FFF;
	box-shadow: 0 3px 17px rgba(0, 0, 0, 0.10)
}
#ranking .descrr:before {
	content: none
}
.updatemark.ct {
	font-size: 23px;
	font-weight: bold;
	color: #66b8ff
}
#ranking .updatemark.ct {
	color: #66b8ff;
	letter-spacing: .05em;
	font-size: 17px;
	padding: 12px 0
}
span.updatemarkk {
	display: inline-block;
    color: #676767;
    background: #f4f4f4;
	margin: 10px 0 0;
	border-radius: 17px;
	padding: 2px 13px;
	font-size: 14px
}
#ranking .ct.shareb {
	margin: 5px 0;
	font-size: 43px
}
#ranking .descrr .shareb .fa-facebook {
	color: #6c90ff;
	font-size: 32px
}
#ranking .descrr .ct.shareb {
	font-size: 34px
}
.shareb.ct a {
	padding: 0 2px;
	display: inline-block;
	text-decoration: none
}
.shareb.ct a:hover {
	transform: translateY(-4px)
}
.shareb .fa-twitter {
	color: #6abaff
}
.shareb .fa-facebook {
	color: #829cff;
	font-size: 39px
}
.shareb .fa-hatena {
	color: #619fff
}
.shareb .fa-get-pocket {
	color: #ff7e7e
}
.contentsin {
	margin: 100px 0 2em
}
.h2p {
	position: relative;
	display: inline-block;
	padding: 0;
	font-size: 22px;
	font-weight: bold;
	margin: 20px 13px 0
}
.conlink {
	max-width: 824px
}
@media screen and (max-width:839px) {
	.tb {
		padding: 0 120px 20px!important;
	}
	.descrr, .conlink {
		max-width: 657px
	}
}
@media screen and (max-width:670px) {
	.tb {
		padding: 0 80px 20px!important;
	}
	.descrr, .conlink {
		max-width: 488px
	}
}
.conlink {
	margin: .5em auto
}
.bookimg, .sideinfo {
	display: table-cell;
	vertical-align: middle
}
.sideinfo {
	padding-left: 30px
}
.sideinfo {
	text-align: left
}
.bookimg {
	display: table-cell;
	width: 160px
}
.bookimg a {
	position: relative;
	display: block;
	padding-bottom: 0 !important;
	box-shadow: 0 12px 23px -4px rgba(0, 0, 0, 0.37)
}
.bookimg a:after {
	content: '';
	overflow: hidden;
	width: 100%;
	left: 0;
	height: 100%;
	position: absolute;
	top: 0;
	box-shadow: inset -2px 0 2px rgba(0, 0, 0, .15), -2px 2px 6px -1px rgba(0, 0, 0, 0.26);
	transition: .5s
}

.booktitle {
	margin: 70px 0 0;
	line-height: 1.55;
	padding: 22px 5px;
	background: #eee;
	color: #211a18;
	font-size: 22px;
	font-weight: bold
}
#ranking .contentsin, .lastbox {
	text-align: center;
	margin: 50px auto 2em;
	max-width: 824px
}
.lastbox {
	padding-top: 10px
}
.ablock ul {
	margin-left: 10px;
	font-size: 14px;
	margin-top: 7px
}
.ablock ul li {
	font-size: 17px;
}
i.fa.fa-star-o {
	color: #66b8ff
}

.ablock ul li span.rate35 .fa, .ablock ul li span.rate4 .fa {
	color: #f2ac56
}
.ablock ul li span.ratefive .fa, .ablock ul li span.fourfive .fa {
	color: #f4bd1b
}
.expla {
	margin: 20px 0 10px;
	text-align: left
}
.sasipic span {
	color: #4a4a4a;
	text-align: center;
	display: block;
	font-size: 13px
}
.expla p, .conlink {
	margin: 10px 9px 10px 15px
}
p.sasipic {
	background: #efefef;
	padding: 15px 15px 5px;
	max-width: 350px;
	position: relative;
	margin-top: 24px !important;
	margin-bottom: 20px !important
}
.footer-02 {
	background: #4886ff
}
.footer-02 .footer-copy {
	text-align: center;
	color: rgba(255, 255, 255, 0.46);
	font-size: 12px
}
img {
	max-width: 100%;
	height: auto
}

#ranking .copyright {
    margin: 0px 0 0;
    color: rgba(255,255,255,0.46);
}

#ranking .footer-02 {
	padding: 5px 10px;
    text-align: center;
}

@media screen and (max-width:767px) {
	.expla p, .conlink {
		margin: 10px 17px 10px 23px
	}
	#headertitle {
		padding-top: 35px
	}
	.hajimeni {
		max-width: 550px
	}
	.table-right {
		width: 300px
	}
	.table-left {
		width: 250px
	}
}
@media screen and (max-width:600px) {
	.tb {
		padding: 0 40px 20px!important;
	}
	.post-title {
		font-size: 23px;
		padding: 0px 20px!important;
	}
	.hajimeni {
		width: 450px
	}
	.table-right {
		width: 250px
	}
	.table-left {
		width: 200px
	}
}
@media screen and (max-width:501px) {
	.tb {
		padding: 0 20px 20px!important;
	}
	.sideinfo {
		padding-left: 10px
	}
	.descrr {
		max-width: 319px
	}
}
@media screen and (max-width:450px) {
	.apps {
		text-align: center;
	}
	.apps .sml {
		display: block;
	}
	.expla p, .conlink {
		margin: 10px 9px 10px 15px
	}
	.sideinfo {
		padding-left: 5px
	}
	.bookimg {
		width: 135px
	}
	.tb {
		padding: 0 10px 20px!important;
	}
	.table-c, .hajimeni {
		width: 100%;
		display: block;
		text-align: center
	}
	.table-left {
		padding: 0 20px
	}
}
@media screen and (max-width:350px) {
	.ablock ul li {
		font-size: 14px
	}
	.sideinfo {
		padding-left: 0
	}
	.bookimg {
		width: 120px
	}
	.descrr {
		max-width: 291px
	}
}
a.back {
	display: inline-block;
	background: #c7e5ff;
	font-size: 19px;
	margin: 5px 7px 32px;
	color: #66b8ff;
	text-decoration: none;
	padding: 5px 15px;
	font-weight: bold;
	border-radius: 8px;
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.21)
}
a.back:hover {
	box-shadow: 0 3px 4px rgba(0, 0, 0, 0.25)
}
a.openBtn.araised.bcblue {
	display: inline-block;
	text-decoration: none;
	background: #f4f4f4;
	margin: 0 14px;
	color: #9ca1a6;
	cursor: pointer;
	padding: 5px 13px;
	font-size: 14px;
	border-radius: 7px
}
a.openBtn.araised.bcblue:hover {
	background: #c7e2fa
}
a.bl {
	text-decoration: none;
	padding-bottom: 10px
}
.ddd {
	display: none
}
.netabare {
	text-align: left
}
span.prog {
	display: inline-block;
	background: #6dbbfe;
	font-weight: bold;
	top: 0;
	margin-left: 10px;
	margin-bottom: 5px;
	right: 0;
	border-radius: 20px;
	line-height: 1.3;
	color: #FFF;
	letter-spacing: 1px;
	padding: 7px 13px;
	font-size: 16px
}
#ranking .wrap {
    box-sizing: border-box;
    margin: 0 auto;
}

#ranking #main {
width: 100%!important;
}

#ranking #content, .post-template-single-ranking #content {
    margin-top: 0!important;
}

#ranking.contentsin, .lastbox {
    margin: 50px auto 2em;
    max-width: 927px;
}

#ranking nav#bread, .post-template-single-ranking .footer-02 {
    background: #f1f3f4;
}

#ranking #breadcrumb {
	background: #f1f3f4;
    overflow: hidden;
    font-size: 14px;
    padding: 15px 3px;
    line-height: 22px;
    border-bottom: solid 1px rgba(255,255,255,0.33);
}

#ranking #breadcrumb li a {
    text-decoration: none;
    color: #211a18;
    padding: 0 4px;
	font-weight: 700;
}

#ranking .tb {
    display: table;
    background: #eee;
    width: 100%;
    padding: 0 180px 30px;
}

#ranking .fukidesc {
    padding: 15px;
}

body.post-template-single-ranking  {
    background-color: #ffffff!important;
}

#kando .main-bc2 {
    border: 1px solid #0E9E34;
    background-color: #25C049;
}

#kando .red-bc2 {
    border: 1px solid #e33b25;
    background-color: #e94a35;
}

@media screen and (max-width: 450px) {
.ytbmovies {
    border-left-width: 20px;
    border-right-width: 20px;
}}

.ytbmovies {
    border: solid 10px #eee;
    border-left-width: 30px;
    border-right-width: 30px;
    border-bottom-width: 20px;
    background: black;
}


/*--------------------------------------
ボタン
--------------------------------------*/
/* ボタンを横幅いっぱい */
.raised {
    padding: .6em 1.3em;
    display: block!important;
}

/* ボタンの色 */
#inner-content .red-bc2 {
    background-color: #E53935;
}

#inner-content .accent-bc2 {
    background-color: #FF5722;
}

#inner-content .main-bc2 {
    background-color: #4CAF50;
}

#inner-content .amazon {
    background-color: #f0c14b;
}

.amazone-button .raised {
    color: #111111;
}
/* 内部リンク用ボタン */
.g2cpn {
    padding-top: 10px;
    border-radius: 5px;
    display: block;
    margin: 0;
    text-align: center;
    letter-spacing: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
}

.g2cpn a {
	    color: #211a18;
    display: inline-block;
    width: 50%;
    border-radius: 3px;
	 border: 1px solid #181818;
    box-shadow: 0 4px 0 0 rgba(0,0,0,.11);
    background-color: #fff;
    padding: .5em 20px;
    font-weight: bold;
    text-decoration: none;
}

@media screen and (max-width: 767px) {
	.g2cpn a {
    width: 100%!important;
}}

.g2cpn a:hover{
    text-decoration: none;
    background: none;
    color: #ffffff;
	 background: #211a18;
}

/*--------------------------------------
マイクロコピー
--------------------------------------*/
.wattl {
	font-weight: bold;
   margin: 10px 0;
    text-align: center;
    font-size: 16px;
    line-height: 1.3;
}

/*--------------------------------------
Q&A
--------------------------------------*/
#inner-content .hh.hhq:before, #inner-content .hh.hha:before {
    top: 2px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 102%!important;
}

#inner-content .hh.hhq, #inner-content .hh.hha {
    padding: 0 0 0 40px;
    font-size: 100%!important;
}

#inner-content .hh.hhq + .hh.hha {
    margin-top: 1em;
}

/*--------------------------------------
この記事に関するキーワード
--------------------------------------*/
/* フォントアイコン */
.meta-tag:before{
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900;
}

/*--------------------------------------
SNS
--------------------------------------*/
.fa-facebook:before {
	content: "\f39e"!important;
}
.profile-sns li .fa-twitter {
	background: #55acee;
}
.profile-sns li .fa-facebook, .profile-sns li .fa-facebook-f {
	background: #3b5998;
}
.profile-sns li i {
	border-radius: none;
	border-radius: 3px;
}
.profile-sns li .fa-instagram {
	background: #f99593;
}
.profile-sns li .fa-instagram {
	background: none;
}
.profile-sns li .fa-line {
	background: #13bf00;
}
.insta_btn {
	display: inline-block;
	text-align: center;
	color: #2e6ca5;
	font-size: 20px;
	text-decoration: none;
}
.insta_btn:hover {
	color: #668ad8;
	transition: .5s;
}
.insta_btn .insta {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 40px;
	vertical-align: middle;
	background: -webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
	background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
	overflow: hidden;
	border-radius: 3px;
}
.insta_btn .insta:before {
	content: '';
	position: absolute;
	top: 23px;
	left: -18px;
	width: 40px;
	height: 40px;
	background: -webkit-radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
	background: radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
}
.insta_btn .fa-instagram {
	color: #FFF;
	position: relative;
	z-index: 2;
	font-size: 25px;
}
.sns-dif ul li .fa-line {
	font-size: 63px;
}
.sns-dif ul li .fa-facebook {}
.tw .dfont {
	color: #55acee!important;
}
.tw a {
	background: #55acee;
}
.tw a, .tw .scc {
	color: #ffffff;
}
.fb .dfont {
	color: #4f96f6!important;
}
.fb a {
	background: #4f96f6;
}
.fb a, .fb .scc {
	color: #ffffff;
}
.hatebu .dfont {
	color: #008fde!important;
}
.hatebu a {
	background: #008fde;
}
.hatebu a, .hatebu .scc {
	color: #ffffff;
}
.pkt .dfont {
	color: #ef3f56!important;
}
.pkt a {
	background: #ef3f56;
}
.pkt a, .pkt .scc {
	color: #ffffff;
}
.line .dfont {
	color: #00b900!important;
}
.line a {
	color: #13bf00;
}
.sns-btn__title:before, .sns-btn__title:after {
	background-color: #211a18;
}
.sns-btn__title:before, .sns-btn__title:after {
	background-color: #211a18;
}
.sns-btn__title {
	font-size: 14px;
}
.sns-btn__title {
	color: #211a18;
}
@media only screen and (min-width: 481px) {
	.sns-dif ul li a {
		width: 52px;
		height: 52px;
	}
}

/*--------------------------------------
更新日と投稿日
--------------------------------------*/
@media screen and (max-width: 767px) {
.entry-meta {
    text-align: right;
    font-size: 13px!important;
}}

.entry-meta {
    font-size: 14px;
    color: #777;
}

/*--------------------------------------
Rinker
--------------------------------------*/
.yyi-rinker-contents {
	margin-top: 80px!important;
    position: relative;
}

div.yyi-rinker-contents {
    border: none;
    box-shadow: 0 0 0 1px rgba(0,0,0,.1) inset;
    margin: 1em 0;
}

.yyi-rinker-contents:before {
    content: '';
    background-image: url(images/itiosid.png);
    width: 150px;
    height: 50px;
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 100%;
}

div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink {
    background: #FFC266;
}

div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a {
    color: rgba(0,0,0,.54);
}

div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink {
    background: #D95656;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink {
    background: #51a7e8;
}
div.yyi-rinker-contents ul.yyi-rinker-links li{
    position:relative;  
}
div.yyi-rinker-contents ul.yyi-rinker-links li:before {
    position:absolute;
     right: 10px;
    font-family: FontAwesome;
    content: "\f0da";
     color:#fff;
    }
.fa5 div.yyi-rinker-contents ul.yyi-rinker-links li:before {
   font-family: "Font Awesome 5 free";
    font-weight:900;
   content: "\f105";
    }

.fa5 div.yyi-rinker-contents ul.amazonlink li:before {
    color: rgba(0,0,0,.54)!important;
    }

div.yyi-rinker-contents ul.yyi-rinker-links li a:hover{
    box-shadow: 0 12px 15px -5px rgba(0,0,0,.25);
}
div.yyi-rinker-contents ul.yyi-rinker-links li a {
    height: 37px;
    line-height: 37px;
    font-size: 0.95em;
    padding-left: 10px;
    padding-right: 0;
    border-radius: 3px;
}
div.yyi-rinker-contents ul.yyi-rinker-links li {
    display: inline-block;
    height: 37px;
    margin: 5px 10px 5px 0;
    padding: 0 25px 0 10px;
    border-radius: 3px;
    background: #73c1ea;
    box-shadow: 0 8px 15px -5px rgba(0,0,0,.25);
    font-size: .95em;
    font-weight: bold;
    vertical-align: middle;
    line-height: 37px;
    transition: .3s ease-in-out;
}
div.yyi-rinker-contents div.yyi-rinker-image {
    width: 100px;
    min-width: 100px;
    padding:0;
}
.yyi-rinker-title {
    font-size: 1em;
}
div.yyi-rinker-contents div.yyi-rinker-title a {
    font-weight: bold;
}

div.yyi-rinker-contents ul.yyi-rinker-links {
    margin: 0;
 }
div.yyi-rinker-info {
    padding-left: 15px;
}
div.yyi-rinker-contents img.yyi-rinker-main-img {
    width:100px;
}
div.yyi-rinker-contents div.yyi-rinker-box div.yyi-rinker-info {
    width: calc(100% - 100px);
}

@media screen and (max-width: 767px) {
	div.yyi-rinker-contents div.yyi-rinker-title a {
    font-size: 1em;
}
}

/*--------------------------------------
関連記事
--------------------------------------*/
.re ul {
    list-style-type: none;
    -webkit-padding-start: 0;
    padding-left: 0;
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    margin-top: 0;
    margin-bottom: 0em;
    padding: 0em 0em 0em 0em;
    border: none!important;
}

.re ul li {
    display: block;
    width: 48%;
    margin: 14px 1% 0 1%;
    float: left;
}

@media screen and (max-width: 767px) {
	.re ul li {
    width: 100%;
    float: none;
    margin: 1em 0;
}
.rlmg {
    width: 80px;
    height: 80px;
}}

/*--------------------------------------
リストタグ
--------------------------------------*/
.entry-content blockquote ul, .entry-content blockquote ol {
    border: none;
    padding: 5px 0 5px 20px;
    margin: 0;
}

.entry-content table ul, .entry-content table ol {
    border: none;
    padding: 5px 0 5px 20px;
    margin: 0;
}

.list-raw ul li::before {
    position: absolute;
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    left: 0px;
    top: calc(50% - 6px);
    background: #31aae2;
    border: solid 3px #bee5fd;
}

.list-raw ul li {
    padding: 5px 0px 5px 23px;
    color:#211a18;
    border-radius: 3px;
    background-size: 17px;
    position: relative;
}

.list-raw ul li {
    list-style: none;
}

.list-raw ul {
    padding: 0 0 0 0.4em;
}

.li-accentbdr ul, .li-mainbdr ol {
    border-color: #ccc!important;
}

.li-accentbdr ul li::before {
    position: absolute;
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    left: 0px;
    top: calc(50% - 6px);
    background: #31aae2;
    border: solid 3px #bee5fd;
}

.li-accentbdr ul li {
    padding: 5px 0px 5px 23px;
    color:#211a18;
    border-radius: 3px;
    background-size: 17px;
    position: relative;
}

.li-accentbdr ul li {
    list-style: none;
}

.li-accentbdr ul {
    padding: 1em 1em 1em 1.5em;
}

.summary ol {
    padding: 0 0 0 0.4em;
}


/*--------------------------------------
ボックス
--------------------------------------*/
/* フォントアイコン */
.fa-lightbulb:before {
    content: "\f0eb";
}

/* 枠の幅とか1 */
.summary {
    padding: 24px 27px 24px;
    position: relative;
    background: #edf4fb;
    border-radius: 10px;
    margin-top: 54px;
margin-bottom: 20px;
}

.summary *:first-child {
    margin-top: 0;
}

.summary-tit .icon-college-graduation {
    position: absolute;
    left: 14px;
    z-index: 1;
    color: #2d5a83;
}

.summary-tit {
    position: absolute;
    background: #2d5a83;
    color: white;
    top: -20px;
    left: 20px;
    padding: 12px 15px 12px 40px;
    font-weight: bold;
    font-size: 15px;
    line-height: 1;
    text-align: center;
    margin: 0;
    display: inline-block;
    border-radius: 50px;
    border: none;
    z-index: 3;
    box-shadow: 0 0 0px 5px #fff;
}

.summary-tit::after {
    content: "";
    position: absolute;
    width: 29px;
    height: 29px;
    background: white;
    left: 0;
    border-radius: 50%;
    top: 0;
    margin: 5px;
}

@media screen and (max-width: 768px) {
.summary {
    padding: 15px 15px 2px 15px;
    margin-top: 40px;
}}

/* フォントアイコン */
.summary .fa-lightbulb:before {
    background: linear-gradient(130deg, #31aae2 0%,#0b80dc 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/*--------------------------------------
画像サイズ調整
--------------------------------------*/
.smallp {
	width: 230px
}
.smallimg {
	max-width: 300px
}
.midimg {
	max-width: 400px
}
.iconimg, .fukip .iconimg {
	width: 19px
}
.iconimg2, .fukip .iconimg2 {
	width: 38px
}
.iconimg3, .fukip .iconimg3 {
	width: 60px
}
.iconimg4, .fukip .iconimg4 {
	width: 53px
}
.iconimg5, .fukip .iconimg5 {
	width: 80px
}
.iconimg6, .fukip .iconimg6 {
	width: 100px
}
.iconimg15, .fukip .iconimg15 {
	width: 150px
}
.iconimg20, .fukip .iconimg20 {
	width: 200px
}

/*--------------------------------------
マージン
--------------------------------------*/
.m0{ margin: 0!important; }
.m0-t{ margin-top: 0!important; }
.m0-r{ margin-right: 0!important; }
.m0-b{ margin-bottom: 0!important; }
.m0-l{ margin-left: 0!important; }

.m5{ margin: 5px!important; }
.m5-t{ margin-top: 5px!important; }
.m5-r{ margin-right: 5px!important; }
.m5-b{ margin-bottom: 5px!important; }
.m5-l{ margin-left: 5px!important; }

.m10{ margin: 10px!important; }
.m10-t{ margin-top: 10px!important; }
.m10-r{ margin-right: 10px!important; }
.m10-b{ margin-bottom: 10px!important; }
.m10-l{ margin-left: 10px!important; }

.m15{ margin: 15px!important; }
.m15-t{ margin-top: 15px!important; }
.m15-r{ margin-right: 15px!important; }
.m15-b{ margin-bottom: 15px!important; }
.m15-l{ margin-left: 15px!important; }

.m20{ margin: 20px!important; }
.m20-t{ margin-top: 20px!important; }
.m20-r{ margin-right: 20px!important; }
.m20-b{ margin-bottom: 20px!important; }
.m20-l{ margin-left: 20px!important; }

.m60-t{ margin-top: 60px!important; }

/*--------------------------------------
フォントサイズ
--------------------------------------*/
.f08em{ font-size: 0.8em!important; }
.f09em{ font-size: 0.9em!important; }
.f10em{ font-size: 1.0em!important; }
.f11em{ font-size: 1.1em!important; }
.f12em{ font-size: 1.2em!important; }
.f13em{ font-size: 1.3em!important; }
.f14em{ font-size: 1.4em!important; }
.f15em{ font-size: 1.5em!important; }
.f16em{ font-size: 1.6em!important; }
.f17em{ font-size: 1.7em!important; }
.f18em{ font-size: 1.8em!important; }
.f19em{ font-size: 1.9em!important; }
.f20em{ font-size: 2.0em!important; }
.f21em{ font-size: 2.1em!important; }
.f22em{ font-size: 2.2em!important; }
.f23em{ font-size: 2.3em!important; }
.f24em{ font-size: 2.4em!important; }
.f25em{ font-size: 2.5em!important; }
.f26em{ font-size: 2.6em!important; }
.f27em{ font-size: 2.7em!important; }
.f28em{ font-size: 2.8em!important; }
.f29em{ font-size: 2.9em!important; }
.f30em{ font-size: 3.0em!important; }

/*--------------------------------------
横サイズ
--------------------------------------*/
.w05 {
	width: 5%
}
.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%
}
.w95 {
	width: 95%
}
.w100 {
	width: 100%
}

/*--------------------------------------
googlewebフォント
--------------------------------------*/




/*--------------------------------------
関連記事のサイズ調整
--------------------------------------*/
.linkto {
max-width: 400px;
position: relative;
padding:0px 0px 0px 0px;
font-size: 90%;
border: solid 1px #d6d6d6;
color:#211a18;
border-radius: 1px;
}

.linkto .tbtext {
padding-right: 10px;
}

.linkto img {
box-shadow:none;
}

/*--------------------------------------
サルワカ風の説明方法
--------------------------------------*/
.boxshadow {
    box-shadow: 0px 2px 7px rgba(0,0,0,.15), 0 5px 6px rgba(0,0,0,.15);
}

.fukidesc {
    display: table;
    margin-bottom: 2em;
    width: 100%;
}

.fukiimg {
    display: table-cell;
    vertical-align: middle;
    width: 50%;
    padding-right: 10px;
}

.fukiimg p {
    margin: 0;
}

.fukiimg img {
    width: 100%;
}

.fukicell {
    display: table-cell;
    vertical-align: middle;
    width: 49%;
    position: relative;
}

.fukip {
    border: #ccc solid 4px;
    position: relative;
    background: white;
    padding: 12px 10px;
    border-radius: 13px;
}

.fukip:before {
    border-right: 23px solid #ccc;
    border-bottom: 20px solid transparent;
    border-top: 20px solid transparent;
    top: 30%;
    content: '';
    position: absolute;
    left: -23px;
}

.fukip:after {
    content: '';
    position: absolute;
    border-right: 24px solid #fff;
    border-bottom: 20px solid transparent;
    border-top: 20px solid transparent;
    top: 30%;
    left: -17px;
}

@media screen and (max-width:680px){
.fukicell, .fukidesc, .fukip, .fukiimg, .post-content .codefuki .codebig, .fukiimg img, .post-content .fukidesc .fukisml, .post-content .fukidesc .fukibig {
    display: block;
    width: 100%;
}

.fukiimg {
    padding-right: 0;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

.fukip {
    border-radius: 6px;
    background: white;
    margin-top: 7px;
    border: solid 2px silver;
}

.fukip:before {
    border-bottom: 20px solid silver;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    top: -40px;
    content: '';
    position: absolute;
    left: 40%;
}

.fukip:after {
    border-bottom: 20px solid white;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    top: -37px;
    content: '';
    position: absolute;
    left: 40%;
}}


/*--------------------------------------
出典
--------------------------------------*/
.photolink a {
	 border-bottom: none!important;
    position: relative;
    line-height: 2.15;
    margin-top: 10px;
    font-size: .8em!important;
    color: #aaa;
    text-decoration: none!important;
}

/*--------------------------------------
文字色
--------------------------------------*/
.b {
    font-weight: bold;
}

.bl {
    display: block;
}

.red {
    color: #e53935;
}

.blue {
    color: #3f51b5;
}

.orange {
    color: #ff9800;
}

.green {
    color: #4CAF56;
}

.gray {
    color: #808080;
}

.black {
    color: #211a18;
}

.yellow {
    color: #ffb838;
}

.white {
    color: #ffffff;
}





















/*
Theme Name: 比嘉眼科
Description: 比嘉眼科
Version: 1.0
Author: noooone
*/


dl:not([class])+dl:not([class]), p:not([class])+.img-center, p:not([class])+dl, p:not([class])+h4, p:not([class])+p:not([class]), p:not([class])+p[class^=text-], p:not([class])+ul, p:not([class])+ul:not([class]), p[class^=text-]+.list, p[class^=text-]+dl, p[class^=text-]+p:not([class]), p[class^=text-]+p[class^=text-], p[class^=text-]+table, p[class^=text-]+ul:not([class]), ul+h4, ul+p:not([class]) {
    margin-top: 1.25em;
}




.floorguide ul {
    margin: 0 0 40px;
    list-style: none;
}

.floorguide li {
    float: left;
width: 23.8%;
    margin-right: 1.2%;
    margin-bottom: 10px;
    line-height: 1.2;
}

.floorguide li a {
    position: relative;
    display: block;
    min-height: 36px;
    padding: 20px 10px 0 56px;
    text-decoration: none;
    border: 1px solid #CCC;
}

.floorguide li .floor {
    position: absolute;
    left: 10px;
    top: 10px;
}

.floorguide li .floor {
    display: block;
    width: 36px;
    height: 36px;
    line-height: 2;
    font-size: 128.57%;
    text-decoration: none;
    text-align: center;
    font-weight: bold;
    color: #FFF;
    background-color: #54ABED;
    border-radius: 3px;
}
	



/*タイムライン*/
.entry-content .tl {
  margin: 1em 0;
}

.main-bdr {
    border-color: #6bb6ff;
}

.main-bc {
    background-color: #6bb6ff;
}

.tl-content {
  position: relative;
  padding: 0 0 1.5em 1.8em;
}
.tl-content:before {
  content: "";
  width: 3px;
  background: #ccd5db;
  display: block;
  position: absolute;
  top: 24px;
  bottom: 0;
  left: 6px;
}
.tl_marker {
  content: "";
  display: block;
  position: absolute;
  top: 6px;
  left: 0;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: solid 3px;
}
.tl-content:not(:first-of-type):not(:last-of-type) .tl_marker {
  background: transparent;
}

.tl-content:last-of-type:before {
  content: none;
}
.tl_label {
  padding-top: 2px;
  color: #90969a;
  font-size: 14px;
  font-weight: bold;
}
.tl_title {
  font-size: 1.1em;
  font-weight: bold;
  line-height: 1.5;
}
.tl_main {
  margin-top: 0.5em;
  padding: 0 0 1.5em;
  font-size: 0.9em;
  line-height: 1.6;
  border-bottom: dashed 1px #ccd5db;
}

/* youtubeレスポンシブ */
.movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}


/* PC */
@media screen and (min-width:1226px), print {

  /*2列表示レスポンシブ*/
  .shtb2.tbrsp {
    display: table;
    table-layout: fixed;
  }
  .shtb2.tbrsp .cell {
    display: table-cell;
    width: 50%;
  }
  .shtb2.tbrsp .cell:first-of-type {
    padding-right: 2%;
  }
  .shtb2.tbrsp .cell:last-of-type {
    padding-left: 2%;
  }
  /*3列表示レスポンシブ*/
  .shtb3.tbrsp {
    display: table;
    table-layout: fixed;
  }
  .shtb3.tbrsp .cell {
    display: table-cell;
    width: 30%;
  }
  .shtb3.tbrsp .cell:nth-child(2) {
    width: 35%;
    padding: 0 2.5%;
  }
  .sc {
    padding: 20px;
  }





}



/* タブレット */
@media only screen and (min-width: 960px) and (max-width: 1225px){

.floorguide li {
    width: 49%;
    margin-right: 2%;
}

}





/* スマホ */
@media only screen and (max-width: 960px) {

.floorguide li {
    float: none;
    width: auto;
    margin-right: 0;
}

.floorguide ul {
    margin-bottom: 20px;
}

}



/*--------------------------------
見出し
---------------------------------*/
#contents h2 {
    margin: 60px 0 20px;
    font-weight: 700;
    line-height: 1.6;
    font-size: 1.4em;
}

#contents h3 {
	    margin: 2.6em 0 0.7em;
    padding: 10px 0 10px 10px;
line-height: 1.5;
    font-size: 1.2em;
    border-left: 8px solid #4cbb8c;
    border-color: #4cbb8c;
}



/*--------------------------------
リスト
---------------------------------*/
.list-raw ul {
    padding: 0 0 0 0.4em;
}

.list-raw ul li {
    list-style: none;
}

.list-raw ul li {
    padding: 5px 0px 5px 23px;
    color: #333;
    border-radius: 3px;
    background-size: 17px;
    position: relative;
}

.list-raw ul li::before {
    position: absolute;
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    left: 0px;
    top: calc(50% - 6px);
    background: #31aae2;
    border: solid 3px #bee5fd;
}









img {
    height: auto;
    max-width: 100%;
    color: #fff;
    width: auto;
    vertical-align: middle
}




textarea {
    line-height: 1.5
}

label {
    cursor: pointer
}

@media (max-width:30em) {
    select {
        width: 100%;
        padding: .5em
    }
}

.wrapper {
    position: relative;
    width: 100%;
    height: 100%
}

.siteMain {
    padding-top: 116px
}

@media (max-width:68.75em) {
    .siteMain {
        padding-top: 54px
    }
}

.hamburger {
    display: none;
    position: fixed;
    right: 0;
    z-index: 11;
    width: 54px;
    height: 54px;
    background: #fff;
    text-align: center;
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent
}

.hamburger-line {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: 22px;
    height: 2px;
    background: #000;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.hamburger-line1 {
    top: 20px
}

.hamburger-line2 {
    top: 27px
}

.hamburger-line3 {
    top: 34px
}

@media (max-width:68.75em) {
    .hamburger {
        top: 0;
        display: block
    }
}

@media (max-width:40em) {
    .hamburger {
        top: 0;
        right: 0
    }
}

.globalHeader {
    position: fixed;
    z-index: 11;
    left: 0;
    right: 0;
    width: 100%;
    margin: auto;
    background: #fff
}

.globalHeader-top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid #e7e8ee
}

.globalHeader-bottom {
    height: 80px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #e7e8ee
}

.globalHeader-logo {
    line-height: 1;
    z-index: 5
}

.globalHeader-logo a {
    display: block
}

@media (min-width:68.8125em) {
    .globalHeader-logo {
        width: 251px;
        margin: 0 auto 0 20px
    }
}

@media (max-width:68.75em) {
    .globalHeader-bottom {
        height: 54px
    }

    .globalHeader-logo {
        width: 200px;
        margin: 12px auto 12px 20px
    }
}

@media (max-width:40em) {
    .globalHeader-logo {
        width: 180px
    }
}

.globalNav {
    z-index: 5
}

.globalNav>ul>li>a {
    position: relative;
    line-height: 1;
    font-size: 15px;
    font-weight: bold;
    color: #666;
    position: relative;
    display: block;
    text-align: center;
    text-transform: capitalize;
    white-space: nowrap
}

@media (min-width:68.8125em) {
    .globalNav {
        margin: 0 0 0 auto
    }

    .globalNav>ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .globalNav>ul>li>a {
        position: relative;
        padding: 33px 30px;
        -webkit-transition: color 0.4s;
        transition: color 0.4s
    }

    .globalNav>ul>li.current>a,
    .globalNav>ul>li.is-active>a,
    .globalNav>ul>li:hover>a {
        color: #32d5b6
    }

    .globalNav>ul>li>a:after {
        position: absolute;
        display: block;
        content: '';
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0 auto;
        width: 90%;
        height: 2px;
        background: #32d5b6;
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transition: -webkit-transform 0.6s;
        transition: -webkit-transform 0.6s;
        transition: transform 0.6s;
        transition: transform 0.6s, -webkit-transform 0.6s
    }

    .globalNav>ul>li.current>a:after,
    .globalNav>ul>li.is-active>a:after,
    .globalNav>ul>li:hover>a:after {
        -webkit-transform: scaleY(1);
        transform: scaleY(1)
    }
}

@media (max-width:68.75em) {
    .globalNav {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 12;
        width: 100%;
        height: 100%;
        background: rgba(255, 255, 255, 0.9);
        pointer-events: none;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        -webkit-transition-property: -webkit-transform;
        transition-property: -webkit-transform;
        transition-property: transform;
        transition-property: transform, -webkit-transform;
        -webkit-transition-duration: .5s;
        transition-duration: .5s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        overflow: scroll;
        -webkit-overflow-scrolling: touch
    }

    .globalNav>ul {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        left: 0;
        right: 0;
        margin: auto;
        display: block
    }

    .globalNav>ul>li {
        margin: 0;
        opacity: 0;
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
        -webkit-transition-duration: .5s;
        transition-duration: .5s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        -webkit-transition-delay: 0s;
        transition-delay: 0s;
        -webkit-transition-property: -webkit-transform opcity;
        transition-property: -webkit-transform opcity;
        transition-property: transform opcity;
        transition-property: transform opcity, -webkit-transform opcity;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .globalNav>ul>li.fb {
        display: none
    }

    .globalNav>ul>li>a {
        padding: 1em 0;
        font-size: 1.4rem;
        color: #9a9eb6
    }

    .globalNav>ul>li>a .en {
        padding: .1em .35em
    }

    .globalNav .ja {
        opacity: 1
    }

    .globalNav>ul>li.sns {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .globalNav {
        display: none
    }
}

.globalSubNav {
    position: absolute;
    top: 11px;
    right: 230px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.globalSubNav li {
    line-height: 1;
    margin-right: 40px
}

.globalSubNav li a {
    display: block
}

.globalSubNav li a:hover {
    text-decoration: underline
}

.globalSubNav li a .icon {
    margin-right: .5em;
    margin-top: -2px
}

@media (max-width:68.75em) {
    .globalSubNav {
        display: none
    }
}

.globalFooter-borderLink {
    padding-bottom: 40px
}

.globalFooter-borderLink ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: -9px
}

.globalFooter-borderLink li {
    width: 24%;
    margin-bottom: 9px
}

.globalFooter-borderLink .button {
    display: block;
    padding: 15px 0;
    letter-spacing: 0;
    font-weight: normal
}

@media (max-width:68.75em) {
    .globalFooter-borderLink ul:after {
        content: '';
        display: block;
        width: 32%
    }

    .globalFooter-borderLink li {
        width: 32%
    }
}

@media (max-width:48em) {
    .globalFooter-borderLink ul:after {
        width: 48.5%
    }

    .globalFooter-borderLink li {
        width: 48.5%
    }
}

@media (max-width:40em) {
    .globalFooter-borderLink li {
        width: 100%
    }
}

.globalFooter-apply-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.globalFooter-apply-heading {
    padding: 15px 0
}

.globalFooter-apply-heading .text {
    display: block;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.5;
    border: 2px solid #000;
    text-align: center;
    width: 240px;
    padding: 14px 0;
    margin: 10px 0
}

.globalFooter-apply-img {
    margin: 0 40px
}

.globalFooter-apply-img img {
    width: 395px
}

.globalFooter-apply-body {
    width: 520px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 10px 0
}

.globalFooter-apply-button-document,
.globalFooter-apply-button-pamgplet {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.4;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-radius: 4px;
    border: 1px solid #e24a61;
    padding: 20px 0
}

.globalFooter-apply-button-document .icon,
.globalFooter-apply-button-document .text,
.globalFooter-apply-button-pamgplet .icon,
.globalFooter-apply-button-pamgplet .text {
    display: block;
    text-align: center;
    width: 100%
}

.globalFooter-apply-button-document .icon,
.globalFooter-apply-button-pamgplet .icon {
    font-size: 160%;
    margin-bottom: 10px
}

.globalFooter-apply-button-document {
    width: 57.69%;
    color: #fff;
    background: #e24a61
}

.globalFooter-apply-button-pamgplet {
    width: 40%;
    color: #e24a61;
    background: #fff
}

@media (min-width:80.0625em) {
    .globalFooter-apply-inner {
        height: 168px
    }
}

@media (max-width:80em) {
    .globalFooter-apply {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .globalFooter-apply-inner {
        display: block;
        text-align: center
    }

    .globalFooter-apply-heading {
        display: inline-block;
        padding-top: 0
    }

    .globalFooter-apply-heading .text {
        width: 100%;
        margin: 0;
        border: 0
    }

    .globalFooter-apply-heading .text .space {
        padding-left: .5em
    }

    .globalFooter-apply-heading .text br:last-of-type {
        display: none
    }

    .globalFooter-apply-img {
        display: none
    }

    .globalFooter-apply-body {
        margin: 0 auto;
        padding: 0
    }
}

@media (min-width:48.0625em) {

    .globalFooter-apply-button-document,
    .globalFooter-apply-button-pamgplet {
        -webkit-transition: opacity .4s;
        transition: opacity .4s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .globalFooter-apply-button-document:hover,
    .globalFooter-apply-button-pamgplet:hover {
        opacity: .6
    }
}

@media (max-width:40em) {
    .globalFooter-apply-heading {
        display: block
    }

    .globalFooter-apply-heading .text {
        width: 100%;
        font-size: 15px
    }

    .globalFooter-apply-heading .space {
        padding-left: .5em
    }

    .globalFooter-apply-body {
        width: auto
    }

    .globalFooter-apply-button-document,
    .globalFooter-apply-button-pamgplet {
        font-size: 1rem
    }
}

.globalFooter-bannerUpper {
    margin-bottom: 40px;
    text-align: center
}

.globalFooter-bannerUpper.has-1col a {
    display: inline-block
}

.globalFooter-bannerUpper.has-1col a+a {
    margin-top: 24px
}

.globalFooter-bannerUpper.has-2col ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.globalFooter-bannerUpper.has-2col li {
    width: 49.3%
}

.globalFooter-bannerUpper.has-2col a {
    display: block
}

@media (max-width:48em) {
    .globalFooter-bannerUpper.has-2col ul {
        display: block
    }

    .globalFooter-bannerUpper.has-2col li {
        width: 100%
    }

    .globalFooter-bannerUpper.has-2col li+li {
        margin-top: 20px
    }
}

.globalFooter-banner {
    margin-top: 50px
}

.globalFooter-banner li+li {
    margin-top: 20px
}

@media (min-width:40.0625em) {
    .globalFooter-banner {
        display: none
    }
}

.globalFooter-visitorLink {
    padding-top: 40px;
    padding-bottom: 40px
}

.globalFooter-visitorLink a {
    display: block
}

.globalFooter-visitorLink a .text .icon {
    font-size: 80%;
    margin-left: .7em
}

@media (min-width:80.0625em) {
    .globalFooter-visitorLink ul:after {
        content: '';
        display: block;
        width: 16.666%
    }

    .globalFooter-visitorLink li {
        width: 16.666%
    }

    .globalFooter-visitorLink li {
        border-left: 1px solid #e7e8ee
    }
}

@media (max-width:80em) {
    .globalFooter-visitorLink ul:after {
        content: '';
        display: block;
        width: 33.333%
    }

    .globalFooter-visitorLink li {
        width: 33.333%
    }

    .globalFooter-visitorLink li:first-child,
    .globalFooter-visitorLink li:nth-child(2),
    .globalFooter-visitorLink li:nth-child(3) {
        border-bottom: 1px solid #e7e8ee
    }
}

@media (min-width:48.0625em) {
    .globalFooter-visitorLink a {
        -webkit-transition: color .4s;
        transition: color .4s
    }

    .globalFooter-visitorLink a:hover {
        color: #32d5b6
    }
}

@media (min-width:40.0625em) {
    .globalFooter-visitorLink ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        border-right: 1px solid #e7e8ee
    }

    .globalFooter-visitorLink li {
        border-left: 1px solid #e7e8ee
    }

    .globalFooter-visitorLink a {
        padding: 30px 0;
        text-align: center
    }

    .globalFooter-visitorLink a>.icon {
        font-size: 250%;
        display: block;
        text-align: center;
        margin-bottom: 20px
    }
}

@media (max-width:40em) {
    .globalFooter-visitorLink ul {
        border-top: 1px solid #e7e8ee
    }

    .globalFooter-visitorLink li {
        width: 100%;
        border-bottom: 1px solid #e7e8ee
    }

    .globalFooter-visitorLink a {
        position: relative;
        padding: 15px 0
    }

    .globalFooter-visitorLink a>.icon {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        left: 0;
        font-size: 24px
    }

    .globalFooter-visitorLink a .text {
        display: block;
        padding-left: 40px
    }

    .globalFooter-visitorLink a .text .icon {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        right: 0
    }
}

@media (max-width:20em) {
    .globalFooter-visitorLink .text {
        font-size: 1rem
    }
}

.globalFooter-sitemap {
    padding-top: 40px;
    padding-bottom: 40px
}

.globalFooter-sitemap-boxGroup.secondary {
    width: 22.5%;
    padding-left: 40px;
    border-left: 1px solid #fff
}

.globalFooter-sitemap-box {
    line-height: 1;
    padding-top: 40px;
    padding-bottom: 40px
}

.globalFooter-sitemap-box-heading {
    margin-bottom: 17px
}

.globalFooter-sitemap-box-heading a {
    display: inline-block;
    position: relative;
    padding-bottom: 15px;
    font-size: 16px;
    font-weight: bold
}

.globalFooter-sitemap-box-heading a:before {
    position: absolute;
    display: block;
    content: '';
    left: 0;
    bottom: 0;
    width: 20px;
    height: 2px;
    background: #32d5b6
}

.globalFooter-sitemap-box ul {
    font-size: 13px;
    letter-spacing: .05em
}

.globalFooter-sitemap-box li+li {
    margin-top: 10px
}

.globalFooter-sitemap-box li a {
    line-height: 1.4
}

.globalFooter-sitemap-box li a:hover {
    text-decoration: underline
}

.globalFooter-sitemap-box li.has-blank {
    position: relative
}

.globalFooter-sitemap-box li.hide-in-footer {
    display: none
}

@media (min-width:80.0625em) {
    .globalFooter-sitemap-boxGroup.primary {
        width: 77.5%
    }

    .globalFooter-sitemap-boxGroup.primary .globalFooter-sitemap-box {
        width: 22%
    }
}

@media (max-width:80em) {
    .globalFooter-sitemap-inner {
        display: block
    }

    .globalFooter-sitemap-boxGroup.primary {
        width: 100%
    }

    .globalFooter-sitemap-boxGroup.primary .globalFooter-sitemap-box {
        width: 25%
    }

    .globalFooter-sitemap-boxGroup.secondary {
        display: none
    }
}

@media (min-width:48.0625em) {
    .globalFooter-sitemap-inner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .globalFooter-sitemap-boxGroup.primary {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .globalFooter-sitemap-box-heading a {
        -webkit-transition: color 0.3s;
        transition: color 0.3s
    }

    .globalFooter-sitemap-box-heading a:hover {
        color: #32d5b6
    }
}

@media (max-width:48em) {
    .globalFooter-sitemap-box {
        padding: 0;
        margin-bottom: 0
    }

    .globalFooter-sitemap-boxGroup.primary .globalFooter-sitemap-box {
        width: 100%
    }

    .globalFooter-sitemap-boxGroup.secondary {
        display: block;
        width: 100%;
        padding-left: 0;
        border-left: 0
    }

    .globalFooter-sitemap-boxGroup.secondary .globalFooter-sitemap-box {
        width: 100%
    }

    .globalFooter-sitemap-box-heading {
        position: relative;
        margin-bottom: 0
    }

    .globalFooter-sitemap-box-heading a {
        padding: 1em 0;
        font-size: 1rem
    }

    .globalFooter-sitemap-box-heading a:before {
        display: none
    }

    .globalFooter-sitemap-box-heading:after {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        z-index: 3;
        right: -1em;
        content: "＋";
        width: 3em;
        height: 3em;
        line-height: 3em;
        text-align: center;
        cursor: pointer
    }

    .globalFooter-sitemap-box-heading.is-active:after {
        content: "－"
    }

    .globalFooter-sitemap-box-body {
        display: none;
        overflow: hidden
    }

    .globalFooter-sitemap-box ul {
        padding: 1em 0 2em
    }
}

.globalFooter-symbol {
    padding-top: 40px;
    padding-bottom: 40px
}

.globalFooter-address {
    text-align: center;
    margin-bottom: 40px
}

.globalFooter-address img {
    width: 240px
}

.globalFooter-address p {
    font-size: 13px;
    margin-top: 10px
}

@media (max-width:40em) {
    .globalFooter-address {
        margin-bottom: 20px
    }

    .globalFooter-address img {
        width: 220px
    }

    .globalFooter-address p {
        font-size: 12px
    }
}

.globalFooter-contact {
    text-align: center;
    margin-bottom: 30px
}

.globalFooter-contact li {
    display: inline-block;
    margin: 0 10px
}

.globalFooter-contact a {
    display: block;
    font-size: 15px;
    font-weight: bold;
    line-height: 1;
    letter-spacing: 0;
    width: 250px;
    padding: 14px 0;
    border-radius: 3px
}

.globalFooter-contact .phone a {
    border: 1px solid #000
}

.globalFooter-contact .mail a {
    color: #fff;
    background: #e24a61;
    border: 1px solid #e24a61
}

.globalFooter-contact .icon {
    margin-top: -4px;
    margin-right: 6px
}

@media (min-width:48.0625em) {
    .globalFooter-contact a {
        -webkit-transition: color .4s;
        transition: color .4s
    }
}

@media (max-width:40em) {
    .globalFooter-contact li {
        display: block;
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        text-align: center
    }

    .globalFooter-contact li+li {
        margin-top: 15px
    }

    .globalFooter-contact a {
        display: inline-block;
        width: 70%
    }
}

@media (max-width:30em) {
    .globalFooter-contact a {
        width: 100%
    }
}

.globalFooter-sns {
    text-align: center
}

.globalFooter-sns-label {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    margin-bottom: 1em;
    text-transform: capitalize
}

.globalFooter-sns li {
    display: inline-block;
    margin: 0 5px
}

.globalFooter-sns a {
    font-size: 1.5rem;
    -webkit-transition: color .4s;
    transition: color .4s
}

.globalFooter-sns a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding-left: 2px;
    border-radius: 50%;
    background: #e7e8ee
}

@media (min-width:48.0625em) {
    .globalFooter-sns a {
        -webkit-transition: background .4s, color .4s;
        transition: background .4s, color .4s
    }

    .globalFooter-sns a:hover {
        color: #fff;
        background: #32d5b6
    }
}

.globalFooter-info {
    padding-top: 40px;
    padding-bottom: 40px;
    background: #000
}

.globalFooter-info,
.globalFooter-info a {
    color: #fff
}

.globalFooter-info-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.globalFooter-info-link {
    margin-right: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.globalFooter-info-link li {
    line-height: 1;
    padding-right: 10px
}

.globalFooter-info-link li+li {
    border-left: 1px solid #fff;
    padding-left: 10px
}

.globalFooter-info-link a {
    font-size: 13px
}

.globalFooter-info-link a:hover {
    text-decoration: underline
}

.globalFooter-copy {
    font-size: 13px;
    letter-spacing: 0;
    margin-left: auto
}

@media (max-width:30em) {
    .globalFooter-info-inner {
        display: block
    }

    .globalFooter-copy {
        margin-top: 20px
    }
}

.pageTop {
    display: block;
    width: 65px;
    text-align: center;
    margin-left: auto;
    margin-right: auto
}

.pageTop .icon {
    font-size: 250%
}

.pageTop .text {
    display: block;
    font-size: 14px;
    text-transform: uppercase;
    white-space: nowrap;
    letter-spacing: 0
}

@media (min-width:48.0625em) {
    .pageTop {
        margin-top: 60px;
        margin-bottom: 60px;
        -webkit-transition: background .4s, color .4s;
        transition: background .4s, color .4s
    }

    .pageTop:hover {
        color: #32d5b6
    }
}

@media (max-width:48em) {
    .pageTop {
        padding-top: 15%;
        padding-bottom: 15%
    }
}

.megaMenu {
    position: fixed;
    top: 116px;
    left: 0;
    width: 100%;
    overflow: hidden;
    z-index: 0;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95), visibility 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
    transition: opacity 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95), visibility 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95)
}

.megaMenu-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 40px;
    padding-bottom: 40px;
    max-width: 800px;
    -webkit-transition: opacity 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
    transition: opacity 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95)
}

.megaMenu.guide .megaMenu-inner {
    max-width: 1000px
}

.megaMenu-img {
    width: 200px
}

.megaMenu-body {
    width: 560px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.megaMenu.guide .megaMenu-body {
    width: 760px
}

.megaMenu.course .megaMenu-body {
    width: 100%
}

.megaMenu-linkGroup {
    overflow: hidden;
    width: 100%
}

.megaMenu-linkGroup li {
    float: left;
    width: 48%;
    border-top: 1px dotted #e7e8ee
}

.megaMenu.guide .megaMenu-linkGroup li {
    width: 30%;
    margin-right: 3.3%
}

.megaMenu.guide .megaMenu-linkGroup li:nth-last-child(3) {
    border-bottom: 1px dotted #e7e8ee
}

.megaMenu.boshu .megaMenu-linkGroup li:nth-child(2n),
.megaMenu.event .megaMenu-linkGroup li:nth-child(2n) {
    float: right
}

.megaMenu .megaMenu-linkGroup li:last-child,
.megaMenu .megaMenu-linkGroup li:nth-last-child(2) {
    border-bottom: 1px dotted #e7e8ee
}

.megaMenu-linkGroup li a:after {
    display: inline-block;
    font-size: 12px;
    content: "\e910";
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 0;
    font-family: "chuoa-icon" !important;
    line-height: 1
}

.megaMenu-linkGroup-hasThumbnail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.megaMenu.course .megaMenu-linkGroup-hasThumbnail li {
    width: 31.5%
}

.megaMenu-linkGroup-hasThumbnail img {
    width: 100%
}

.megaMenu-linkGroup-hasThumbnail .title {
    margin-top: .6em
}

.megaMenu-title {
    margin-top: 1em;
    text-align: center
}

.megaMenu-title .icon {
    margin-left: .5em
}

.megaMenu a {
    position: relative;
    display: block;
    font-size: 14px;
    line-height: 1;
    padding: 1em 0
}

.megaMenu a .icon {
    font-size: .8em
}

.megaMenuBg {
    position: fixed;
    z-index: 5;
    top: 116px;
    left: 0;
    width: 100%;
    height: auto;
    background: #fff;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: top;
    transform-origin: top;
    -webkit-transition: height 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95), -webkit-transform 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95);
    transition: height 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95), -webkit-transform 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95);
    transition: transform 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95), height 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95);
    transition: transform 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95), height 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95), -webkit-transform 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95)
}

.megaMenuOverlay {
    position: fixed;
    content: '';
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    -webkit-transition: visibility 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95);
    transition: visibility 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity 0.4s cubic-bezier(0.445, 0.05, 0.55, 0.95)
}

@media (min-width:48.0625em) {

    .megaMenu-linkGroup-hasThumbnail img,
    .megaMenu a {
        display: block;
        -webkit-transition: opacity 0.3s;
        transition: opacity 0.3s
    }

    .megaMenu-linkGroup-hasThumbnail a:hover img,
    .megaMenu a:hover {
        opacity: .6
    }
}

.drawerMenu {
    position: fixed;
    z-index: 9;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 55px 40px;
    background: #fff;
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: opacity 0.4s cubic-bezier(0.52, 0.08, 0.18, 1), -webkit-transform 0.6s cubic-bezier(0.52, 0.08, 0.18, 1);
    transition: opacity 0.4s cubic-bezier(0.52, 0.08, 0.18, 1), -webkit-transform 0.6s cubic-bezier(0.52, 0.08, 0.18, 1);
    transition: transform 0.6s cubic-bezier(0.52, 0.08, 0.18, 1), opacity 0.4s cubic-bezier(0.52, 0.08, 0.18, 1);
    transition: transform 0.6s cubic-bezier(0.52, 0.08, 0.18, 1), opacity 0.4s cubic-bezier(0.52, 0.08, 0.18, 1), -webkit-transform 0.6s cubic-bezier(0.52, 0.08, 0.18, 1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll
}

.drawerMenu-primary {
    margin: 40px 0 0 0
}

.drawerMenu-primary-title {
    font-size: 22px;
    border-bottom: 1px solid #e7e8ee
}

.drawerMenu-primary-box-heading {
    position: relative;
    display: block;
    padding: 1em 0;
    font-size: 1.1rem;
    border-bottom: 1px solid #e7e8ee;
    cursor: pointer
}

.drawerMenu-primary-box-heading .icon {
    margin: -2px .6em 0 0
}

.drawerMenu-primary-box-heading:before {
    display: none
}

.drawerMenu-primary-box-heading:after {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 3;
    right: 0;
    content: "＋";
    width: 3em;
    height: 3em;
    line-height: 3em;
    text-align: center;
    cursor: pointer
}

.drawerMenu-primary-box-heading.is-active:after {
    content: "－"
}

.drawerMenu-primary-box-body {
    display: none;
    overflow: hidden;
    font-size: 1rem
}

.drawerMenu-primary-box ul {
    padding: 1em 0 2em
}

.drawerMenu-primary-box ul li a {
    display: block;
    padding: .3em 0;
    color: #666
}

.drawerMenu-primary-box ul li.has-blank a:before {
    content: "－";
    color: #9a9eb6
}

.drawerMenu-primary-box ul li.hide-in-drawer {
    display: none
}

.drawerMenu-secondary {
    margin-top: 40px
}

.drawerMenu-secondary-title {
    font-size: 18px;
    text-align: center
}

.drawerMenu-sns {
    text-align: center;
    padding-top: 20px
}

.drawerMenu-sns li {
    display: inline-block;
    margin: 0 .6em
}

.drawerMenu-sns a {
    font-size: 24px
}

.drawerMenu-sns a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    padding-left: 2px;
    border-radius: 50%;
    background: #e7e8ee
}

@media (min-width:68.8125em) {
    .drawerMenu {
        display: none
    }
}

@media (max-width:20em) {
    .drawerMenu {
        padding: 55px 30px
    }
}

.visitorMenu {
    position: relative;
    line-height: 1;
    margin: 0 0 0 auto;
    width: 230px
}

.visitorMenu-label {
    position: relative;
    font-weight: bold;
    padding: 11px;
    background: #e7e8ee;
    z-index: 7;
    cursor: pointer;
    border-left: 1px solid #fff
}

.visitorMenu-list {
    position: absolute;
    top: 35px;
    right: 0;
    width: 100%;
    z-index: 6;
    border: solid #fff;
    border-width: 0 0 1px 1px;
    opacity: 0;
    -webkit-transform: translateY(-255px);
    transform: translateY(-255px);
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, transform .3s;
    transition: opacity .3s, transform .3s, -webkit-transform .3s
}

.visitorMenu-list li {
    border-top: 1px solid #fff
}

.visitorMenu-list a {
    position: relative;
    display: block;
    padding: 11px;
    background: #e7e8ee
}

.visitorMenu-label .icon:first-of-type,
.visitorMenu-list a .icon:first-of-type {
    margin: -2px 10px 0 0
}

.visitorMenu-label .icon-angle-bottom-circle,
.visitorMenu-list .icon-angle-right {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 13px
}

.visitorMenu-label .icon-angle-bottom-circle {
    font-size: 18px
}

.visitorMenu-list .icon-angle-right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 12px;
    line-height: 1;
    text-align: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    padding-left: 2px;
    background: #fff
}

@media (max-width:68.75em) {
    .visitorMenu {
        display: none
    }
}

@media (min-width:48.0625em) {
    .visitorMenu-list a {
        -webkit-transition: color .2s;
        transition: color .2s
    }

    .visitorMenu-list a:hover {
        color: #4cbb8c
    }
}

@media (max-width:40em) {
    .visitorMenu {
        width: 100%;
        border-left: 0
    }

    .visitorMenu-label,
    .visitorMenu-list a {
        font-size: 12px
    }

    .visitorMenu-label {
        padding: 15px 20px
    }

    .visitorMenu-list {
        top: 42px
    }

    .visitorMenu-list a {
        position: relative;
        padding: 15px 11px
    }

    .visitorMenu-label .icon-angle-bottom-circle {
        font-size: 16px
    }
}

.breadcrumbs {
    z-index: 1
}

.breadcrumbs li {
    display: inline-block;
    line-height: 1.4
}

.breadcrumbs li+li:before {
    margin-right: .5em;
    font-family: 'chuoa-icon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    vertical-align: middle;
    content: "\e910"
}

.breadcrumbs li:before {
    font-size: 70%;
    line-height: 1
}

.breadcrumbs a:hover {
    text-decoration: underline
}

@media (min-width:68.8125em) {
    .breadcrumbs {
        position: absolute;
        top: -215px;
        left: 0
    }
}

@media (max-width:68.75em) {
    .breadcrumbs {
        display: none
    }
}

@media (min-width:40.0625em) {
    .breadcrumbs li {
        margin-right: .5em
    }

    .breadcrumbs .icon {
        margin: -2px 0 0 1em
    }
}

.slick-slider {
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0
}

.slick-list:focus {
    outline: none
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand
}

.slick-slider .slick-list,
.slick-slider .slick-track {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block
}

.slick-track:after,
.slick-track:before {
    display: table;
    content: ''
}

.slick-track:after {
    clear: both
}

.slick-loading .slick-track {
    visibility: hidden
}

.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

[dir=rtl] .slick-slide {
    float: right
}

.slick-slide img {
    display: block;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.slick-slide.slick-loading img {
    display: none
}

.slick-slide.dragging img {
    pointer-events: none
}

.slick-initialized .slick-slide {
    display: block
}

.slick-loading .slick-slide {
    visibility: hidden
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent
}

.slick-arrow.slick-hidden {
    display: none
}

.slick-next,
.slick-prev {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent
}

.slick-next:focus,
.slick-next:hover,
.slick-prev:focus,
.slick-prev:hover {
    color: transparent;
    outline: none;
    background: transparent
}

.slick-next:focus:before,
.slick-next:hover:before,
.slick-prev:focus:before,
.slick-prev:hover:before {
    opacity: 1
}

.slick-next.slick-disabled:before,
.slick-prev.slick-disabled:before {
    opacity: .25
}

.slick-next:before,
.slick-prev:before {
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;
    opacity: .75;
    color: white;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.slick-prev {
    left: -25px
}

[dir=rtl] .slick-prev {
    right: -25px;
    left: auto
}

.slick-prev:before {
    content: '←'
}

[dir=rtl] .slick-prev:before {
    content: '→'
}

.slick-next {
    right: -25px
}

[dir=rtl] .slick-next {
    right: auto;
    left: -25px
}

.slick-next:before {
    content: '→'
}

[dir=rtl] .slick-next:before {
    content: '←'
}

.slick-dots {
    position: absolute;
    bottom: 15px;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    z-index: 1
}

.slick-dots li {
    position: relative;
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    padding: 5px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent
}

.slick-dots li button:focus,
.slick-dots li button:hover {
    outline: none
}

.slick-dots li button:focus:before,
.slick-dots li button:hover:before {
    opacity: 1
}

.slick-dots li button:before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    background: #dad7cc;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.slick-dots li.slick-active button:before {
    background: #9d4753
}

@media (max-width:560px) {
    .slick-dots {
        bottom: 5%
    }
}

.extraBox.has-border {
    border: 1px solid #e7e8ee
}

.extraBox-heading {
    font-size: 1rem;
    font-weight: bold;
    text-align: center;
    background: #e7e8ee;
    padding: .5em;
    letter-spacing: .1em
}

.extraBox-body ul {
    width: 100%
}

.extraBox-body li+li {
    margin-top: .5em
}

@media (min-width:48.0625em) {
    .extraBoxGroup {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .extraBoxGroup .extraBox {
        width: 48%
    }
}

@media (max-width:48em) {
    .extraBoxGroup .extraBox+.extraBox {
        margin-top: 30px
    }
}

@media (min-width:40.0625em) {
    .extraBox-heading span {
        display: inline-block;
        vertical-align: middle;
        font-size: 1.38rem;
        padding-bottom: 2px
    }

    .extraBox-body {
        padding: 2em
    }
}

@media (max-width:40em) {
    .extraBox-heading span {
        display: inline;
        font-size: 1rem
    }

    .extraBox-body {
        padding: 1.25em
    }
}

.extraBlockList-box {
    border-bottom: 1px dashed #ddd
}

.extraBlockList-link {
    display: block
}

.extraBlockList-box img {
    margin-bottom: 1em
}

@media (min-width:48.0625em) {
    .extraBlockList-link img {
        display: block;
        -webkit-transition: opacity 0.3s;
        transition: opacity 0.3s
    }

    .extraBlockList-link:hover img {
        opacity: .6
    }
}

@media (min-width:40.0625em) {
    .extraBlockList {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin-bottom: -2.25em
    }

    .extraBlockList-box {
        width: 48.5%;
        padding-bottom: 2.25em;
        margin-bottom: 2.25em
    }

    .extraBlockList-box.not-has-border {
        padding-bottom: 0;
        border-bottom: none
    }
}

@media (max-width:40em) {
    .extraBlockList {
        margin-bottom: 3em
    }

    .extraBlockList-box {
        padding-bottom: 1.5em;
        margin-bottom: 1.5em
    }

    .extraBlockList-box:last-child.not-has-border {
        padding-bottom: 0;
        border-bottom: none
    }
}

.extraComment {
    background: #e7e8ee;
    overflow: hidden
}

.extraComment-heading {
    font-weight: bold;
    margin-bottom: .5rem
}

@media (min-width:40.0625em) {
    .extraComment {
        padding: 25px 28px
    }

    .extraComment-heading {
        font-size: 1.38rem
    }
}

@media (max-width:40em) {
    .extraComment {
        padding: 2rem
    }

    .extraComment-heading {
        font-size: 1.2rem
    }
}

.extraCommentHasImg {
    padding: 30px 20px;
    border: 1px solid #e7e8ee
}

.extraCommentHasImg-heading {
    font-weight: bold;
    margin-bottom: .5rem
}

.extraCommentHasImg-img {
    width: 139px
}

.extraCommentHasImg-img img {
    width: 100%
}

.extraCommentHasImg-body p:not([class])+p:not([class]) {
    margin-top: 1em
}

@media (min-width:40.0625em) {
    .extraCommentHasImg {
        display: table;
        width: 100%
    }

    .extraCommentHasImg-heading {
        font-size: 1.38rem
    }

    .extraCommentHasImg-body,
    .extraCommentHasImg-img {
        vertical-align: top;
        display: table-cell
    }

    .extraCommentHasImg-img+.extraCommentHasImg-body {
        padding-left: 30px
    }
}

@media (max-width:40em) {
    .extraCommentHasImg-img {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 1.25em
    }
}

.extraContact {
    text-align: center;
    border: 1px solid #b1b4c8
}

.extraContact-heading {
    font-weight: bold;
    margin-bottom: 1.5rem
}

.extraContact .button {
    position: relative;
    overflow: hidden;
    display: block;
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1;
    letter-spacing: 0;
    width: 300px;
    max-width: 100%;
    padding: 1.5em 0;
    border-radius: 3px
}

.extraContact .button.button-sm {
    font-size: 1.1rem
}

.extraContact .button .icon {
    position: static;
    font-size: 100%;
    -webkit-transform: none;
    transform: none;
    margin-top: -2px;
    margin-right: 6px
}

.extraContact p {
    text-align: center
}

@media (min-width:48.0625em) {
    .extraContact {
        padding: 30px
    }

    *+.extraContact,
    .extraContact+* {
        margin-top: 60px
    }

    .extraContact-heading {
        font-size: 1.38rem
    }

    .extraContact-buttonGroup {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .extraContact .button {
        margin-left: .8%;
        margin-right: .8%
    }

    .extraContact .button:hover {
        color: #fff;
        background: #000
    }
}

@media (max-width:48em) {
    .extraContact {
        padding: 2em 5%
    }

    *+.extraContact,
    .extraContact+* {
        margin-top: 2rem
    }

    .extraContact-heading {
        font-size: 1.2rem
    }

    .extraContact a {
        width: 100%
    }

    .extraContact p {
        text-align: left
    }

    .extraContact .button {
        margin-bottom: 15px
    }
}

@media (max-width:20em) {
    .extraContact .button {
        font-size: 1rem
    }
}

.extraProfile {
    text-align: right;
    margin-left: auto;
    margin-right: auto;
    max-width: 930px
}

.extraProfile-name {
    margin-bottom: .5rem;
    font-weight: bold
}

.extraProfile-name span {
    padding-right: .5em
}

.biyou .extraProfile-name span {
    color: #4cbb8c
}

.kango .extraProfile-name span {
    color: #4cbb8c
}

.kyosei .extraProfile-name span {
    color: #32d5b6
}

.extraProfile-name .icon {
    margin: -2px .6em 0 0
}

.extraProfile-body {
    background: #fff;
    width: 500px;
    z-index: 1;
    position: relative;
    border: 1px solid;
    margin: -60px 0 0;
    text-align: left
}

.biyou .extraProfile-body {
    border-color: #4cbb8c
}

.kango .extraProfile-body {
    border-color: #4cbb8c
}

.kyosei .extraProfile-body {
    border-color: #32d5b6
}

.extraProfile-detail {
    text-align: left
}

.extraProfile dl dt:after {
    content: '：'
}

@media (min-width:68.8125em) {
    .extraProfile-body {
        width: 600px;
        padding: 50px 40px;
        margin-top: -60px
    }
}

@media (max-width:68.75em) {
    .extraProfile-body {
        width: 400px;
        padding: 40px 30px;
        margin-top: -40px
    }
}

@media (min-width:48.0625em) {
    .extraProfile {
        margin-bottom: 40px
    }

    .extraProfile-name {
        font-size: 1.3rem
    }

    .extraProfile dl+dl:before,
    .extraProfile dl dd,
    .extraProfile dl dt,
    .extraProfile dl dt:after {
        display: inline-block;
        vertical-align: middle
    }
}

@media (max-width:48em) {
    .extraProfile {
        margin-bottom: 40px
    }

    .extraProfile img {
        width: 100%
    }

    .extraProfile-body {
        padding: 35px 20px;
        margin-top: -20px;
        margin-left: auto;
        margin-right: auto;
        max-width: 90%;
        background: none
    }

    .extraProfile-name {
        font-size: 1.15rem
    }

    .extraProfile dl {
        margin-top: .7em
    }

    .extraProfile dl dt {
        display: block
    }
}

@media (max-width:30em) {
    .extraProfile-body {
        padding: 30px 15px;
        max-width: 92%
    }

    .extraProfile-name span {
        display: block
    }

    .extraProfile-detail+.extraProfile-detail {
        margin-top: 1em
    }
}

.extraQa dd,
.extraQa dt {
    line-height: 1.6;
    position: relative;
    padding: 11px 0 11px 40px
}

.extraQa dd a,
.extraQa dt a {
    color: #0F7E42;
    text-decoration: underline
}

.extraQa dd div+div {
    margin-top: .8em
}

.extraQa small {
    line-height: 1.4;
    display: block;
    margin-top: .5em
}

.extraQa .answer,
.extraQa .question {
    display: block;
    position: absolute;
    top: 10px;
    left: 0;
    padding-left: 1px;
    width: 25px;
    height: 25px;
    border: 1px solid #000;
    border-radius: 50%;
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
    text-align: center
}

.extraQa .question {
    color: #fff;
    background: #000
}

@media (min-width:48.0625em) {
    .extraQa+.extraQa {
        margin-top: 40px
    }
}

@media (max-width:48em) {
    .extraQa+.extraQa {
        margin-top: 20px
    }
}

.pageContainer {
    position: relative
}

.pageHeader {
    position: relative;
    height: 350px
}

.pageHeader-title {
    position: relative;
    z-index: 1;
    font-weight: bold;
    line-height: 1.5;
    text-align: center;
    padding: 0 .5em;
    padding-top: 115px
}

.pageHeader-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #e7e8ee;
    background-repeat: no-repeat
}

.pageContents {
    position: relative;
    z-index: 1;
    margin-top: -110px;
    background: #fff
}

.pageBody {
    padding-bottom: 90px;
    background: #e7e8ee
}

.pageAnchor {
    margin-bottom: -.5em
}

.pageAnchor li {
    display: inline-block;
    margin: 0 1em .5em 0
}

.pageAnchor li a {
    color: #4478e9;
    text-decoration: underline;
    -webkit-transition: opacity 0.6s;
    transition: opacity 0.6s
}

.biyou.pageAnchor li a {
    color: #f6438a
}

.kango.pageAnchor li a {
    color: #4cbb8c
}

.kyosei.pageAnchor li a {
    color: #2dc4a9
}

.pageAnchor li a:hover {
    opacity: .6
}

.pageAnchor li a .icon {
    margin-left: .4em
}

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

.pageMenu:after {
    content: '';
    display: block;
    width: 30.85%
}

.pageMenu li {
    position: relative
}

.pageMenu li a {
    display: block;
    position: relative;
    overflow: hidden
}

.pageMenu li a:before {
    position: absolute;
    display: block;
    content: '';
    z-index: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    -webkit-transition: opacity 0.6s;
    transition: opacity 0.6s;
    -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
    transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1)
}

.pageMenu img {
    width: 100%
}

.pageMenu-title {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 3;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-weight: bold;
    color: #fff
}

.pageMenu-title .icon {
    font-size: 80%;
    color: #32d5b6;
    margin: -2px 0 0 .5em
}

@media (min-width:68.8125em) {
    .pageMenu li {
        width: 30.85%;
        margin-bottom: 40px
    }
}

@media (max-width:68.75em) {
    .pageMenu li {
        width: 48.5%;
        margin-bottom: 15px
    }
}

@media (min-width:48.0625em) {
    .pageHeader-title {
        font-size: 26px
    }

    .pageContents {
        padding: 90px 7.2%
    }

    .pageMenu li a {
        overflow: hidden;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .pageMenu li a:after {
        position: absolute;
        display: block;
        content: '';
        z-index: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 3px;
        background: #32d5b6;
        -webkit-transform: scalex(0);
        transform: scalex(0);
        -webkit-transform-origin: left;
        transform-origin: left;
        -webkit-transition: -webkit-transform 0.6s;
        transition: -webkit-transform 0.6s;
        transition: transform 0.6s;
        transition: transform 0.6s, -webkit-transform 0.6s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1)
    }

    .pageMenu li a:hover:after {
        -webkit-transform: scalex(1);
        transform: scalex(1)
    }
}

@media (max-width:48em) {
    .pageHeader-title {
        font-size: 1.6rem
    }

    .pageContents {
        padding: 15% 5% 20%
    }

    .pageMenu-title {
        font-size: 1rem
    }
}

@media (min-width:40.0625em) {
    .pageHeader-bg {
        background: url(../../assets/img/component/page/header-bg/guide.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.course {
        background: url(../../assets/img/component/page/header-bg/course.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.biyou {
        background: url(../../assets/img/component/page/header-bg/biyou.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.kango {
        background: url(../../assets/img/component/page/header-bg/kango.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.kyosei {
        background: url(../../assets/img/component/page/header-bg/kyosei.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.event {
        background: url(../../assets/img/component/page/header-bg/event.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.foreign {
        background: url(../../assets/img/component/page/header-bg/foreign.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.future {
        background: url(../../assets/img/component/page/header-bg/future.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.student {
        background: url(../../assets/img/component/page/header-bg/student.jpg) no-repeat;
        background-size: cover
    }

    .pageHeader-bg.graduation-voice {
        background: url(../../assets/img/component/page/header-bg/graduation-voice.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.kaigyou {
        background: url(../../assets/img/component/page/header-bg/kaigyou.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.admission {
        background: url(../../assets/img/component/page/header-bg/admission.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.boshu {
        background: url(../../assets/img/component/page/header-bg/boshu.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.foreign,
    .pageHeader-bg.university {
        background: url(../../assets/img/component/page/header-bg/university.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.contact,
    .pageHeader-bg.entry,
    .pageHeader-bg.request {
        background: url(../../assets/img/component/page/header-bg/form.jpg) 50%;
        background-size: cover
    }

    .pageMenu {
        margin-top: 100px
    }

    .pageMenu-title br,
    .pageMenu .portrait {
        display: none
    }
}

@media (max-width:40em) {
    .pageHeader-bg {
        background: url(../../assets/img/component/page/header-bg/guide-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.course {
        background: url(../../assets/img/component/page/header-bg/course-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.biyou {
        background: url(../../assets/img/component/page/header-bg/biyou-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.kango {
        background: url(../../assets/img/component/page/header-bg/kango-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.kyosei {
        background: url(../../assets/img/component/page/header-bg/kyosei-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.event {
        background: url(../../assets/img/component/page/header-bg/event-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.foreign {
        background: url(../../assets/img/component/page/header-bg/foreign-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.future {
        background: url(../../assets/img/component/page/header-bg/future-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.student {
        background: url(../../assets/img/component/page/header-bg/student-sp.jpg) no-repeat;
        background-size: cover
    }

    .pageHeader-bg.graduation-voice {
        background: url(../../assets/img/component/page/header-bg/graduation-voice-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.kaigyou {
        background: url(../../assets/img/component/page/header-bg/kaigyou-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.admission {
        background: url(../../assets/img/component/page/header-bg/admission-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.boshu {
        background: url(../../assets/img/component/page/header-bg/boshu-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.foreign,
    .pageHeader-bg.university {
        background: url(../../assets/img/component/page/header-bg/university-sp.jpg) 50%;
        background-size: cover
    }

    .pageHeader-bg.contact,
    .pageHeader-bg.entry,
    .pageHeader-bg.request {
        background: url(../../assets/img/component/page/header-bg/form-sp.jpg) 100%;
        background-size: cover
    }

    .pageHeader-title {
        font-size: 1.5rem
    }

    .pageMenu {
        margin-top: 80px
    }

    .pageMenu li {
        margin-bottom: 10px
    }

    .pageMenu-title {
        font-size: .9rem
    }

    .pageMenu .landscape {
        display: none
    }
}

@media (max-width:30em) {
    .pageHeader-title {
        font-size: 1.4rem
    }

    *+.pageAnchor {
        margin-top: 30px
    }
}

@media (max-width:20em) {
    .pageHeader-title {
        font-size: 1.3rem
    }
}

.front .eventInfo {
    display: none
}

.eventInfo-heading {
    margin-bottom: 30px;
    text-align: center;
    font-size: 22px;
    font-weight: bold
}

.eventInfo-body {
    padding: 40px 30px;
    border: 1px solid #000
}

.pageEventList-heading {
    margin-bottom: 30px;
    font-weight: bold;
    text-align: center
}

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

.eventList .link {
    color: #fff
}

.eventList .head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 10px
}

.eventList .date,
.eventList .next {
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap
}

.eventList .next {
    padding: 3px .8em;
    margin-right: 10px;
    background: #000;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    text-transform: capitalize
}

.eventList .date {
    display: none;
    color: #000;
    font-size: 36px;
    font-weight: 300;
    line-height: 1;
    letter-spacing: 0
}

.eventList .date.is-show {
    display: inline-block
}

.eventList .date.is-end {
    font-size: 15px;
    font-weight: bold
}

.eventList .date .day-of-the-week {
    font-size: 17px
}

.eventList .date .day-of-the-week.saturday {
    color: #4cbb8c
}

.eventList .date .day-of-the-week.sunday {
    color: #f6438a
}

.eventList .body {
    position: relative;
    overflow: hidden;
    height: 220px;
    padding: 30px 20px
}

.eventList .body>* {
    position: relative;
    z-index: 2
}

.front .eventList .body {
    height: 190px
}

.eventList .body:before {
    position: absolute;
    display: block;
    content: '';
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../../assets/img/common/dot-black.png);
    background-repeat: repeat
}

.eventList .body p {
    margin-top: 1em;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5
}

.eventList .bg {
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.eventList .bg.taiken {
    background-image: url(../../assets/img/component/event/taiken.jpg);
    background-size: cover;
    background-position: center
}

.eventList .bg.gakusetsu {
    background-image: url(../../assets/img/component/event/gakusetsu.jpg);
    background-size: cover;
    background-position: center
}

.eventList .bg.guidance {
    background-image: url(../../assets/img/component/event/guidance.jpg);
    background-size: cover;
    background-position: center
}

.eventList .bg.other {
    background-image: url(../../assets/img/component/event/other.jpg);
    background-size: cover;
    background-position: center
}

.eventList .name {
    font-weight: bold;
    white-space: nowrap
}

.eventList .time {
    font-weight: 500
}

.eventList .time .icon {
    margin: -2px .3em 0 0
}

@media (min-width:80.0625em) {
    .eventList .next {
        font-size: 16px
    }

    .front .eventList .next {
        font-size: 13px
    }

    .eventList .date {
        font-size: 36px
    }

    .front .eventList .date {
        font-size: 28px
    }

    .front .eventList .date.is-end {
        font-size: 15px;
        font-weight: bold
    }

    .eventList .name {
        font-size: 22px
    }

    .front .eventList .name {
        font-size: 20px
    }

    .eventList .time {
        font-size: 16px
    }

    .front .eventList .time {
        font-size: 1rem
    }

    .front .eventList .body p {
        font-size: .9rem
    }
}

@media (max-width:80em) {
    .eventList .next {
        font-size: 14px
    }

    .eventList .date {
        font-size: 30px
    }

    .eventList .body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .eventList .body p {
        display: none
    }

    .eventList .name {
        font-size: 20px
    }

    .eventList .time {
        font-size: 13px
    }
}

@media (min-width:48.0625em) {
    .eventList .bg {
        -webkit-transition: -webkit-transform 1s;
        transition: -webkit-transform 1s;
        transition: transform 1s;
        transition: transform 1s, -webkit-transform 1s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .eventList .link:hover .bg {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }
}

@media (min-width:68.8125em) {
    .eventList .box {
        width: 23.19328%
    }
}

@media (max-width:68.75em) {
    .eventList {
        margin-bottom: -50px
    }

    .eventList .box {
        width: 48.5%;
        margin-bottom: 50px
    }
}

@media (min-width:40.0625em) {
    .pageEventList-inner {
        border: 1px solid #000;
        padding: 40px 30px
    }

    .pageEventList-heading {
        font-size: 22px
    }
}

@media (max-width:40em) {
    .pageEventList-heading {
        font-size: 18px
    }

    .eventList {
        margin-bottom: -40px
    }

    .eventList .box {
        width: 100%;
        margin-bottom: 40px
    }

    .front .eventList .box {
        width: 48.5%
    }

    .eventList .body {
        height: 120px
    }

    .front .eventList .body {
        height: 120px;
        padding: 30px 15px
    }

    .front .eventList .next {
        font-size: 11px
    }

    .front .eventList .date {
        font-size: 20px
    }

    .front .eventList .date.is-end {
        font-size: 13px
    }

    .eventList .name {
        font-size: 18px
    }

    .front .eventList .name {
        font-size: 15px
    }

    .front .eventList .time {
        font-size: 11px
    }
}

@media (max-width:20em) {
    .front .eventList .box {
        width: 100%
    }
}

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

.indexList-box-title {
    font-weight: bold;
    border-bottom: 1px solid #afb3c7
}

.indexList-box-title .icon {
    display: none;
    position: absolute;
    top: 8px;
    left: 0;
    color: #32d5b6;
    font-size: 11px
}

.indexList-box .button {
    padding: .7em 0 .6em
}

@media (min-width:80.0625em) {
    .indexList-box {
        width: 46.26168%;
        height: 190px
    }

    .indexList-box-title {
        font-size: 18px
    }

    .indexList-box .button {
        width: calc(60.6% - 20px)
    }
}

@media (max-width:80em) {
    .indexList-box {
        width: 48%;
        height: 255px;
        margin-bottom: -80px
    }

    .indexList-box .button {
        left: 0;
        width: 75%
    }
}

@media (min-width:68.8125em) {
    .indexList-box-img {
        width: 190px
    }

    .indexList-box-body {
        width: auto
    }
}

@media (max-width:68.75em) {
    .indexList-box {
        height: 225px
    }

    .indexList-box-img {
        width: 39.4%
    }

    .indexList-box-body {
        width: 60.6%
    }
}

@media (min-width:48.0625em) {
    *+.indexList {
        margin-top: 70px
    }

    .indexList {
        margin-bottom: -80px
    }

    .indexList-box {
        position: relative;
        margin-bottom: 80px
    }

    .indexList-box a {
        display: table;
        width: 100%
    }

    .indexList-box-body,
    .indexList-box-img {
        display: table-cell;
        vertical-align: top
    }

    .indexList-box-body {
        padding-left: 20px
    }

    .indexList-box-img img {
        display: block;
        -webkit-transition: opacity 0.3s;
        transition: opacity 0.3s
    }

    .indexList-box a:hover img {
        opacity: .6
    }

    .indexList-box-title {
        padding-bottom: .5em;
        margin-bottom: .5em;
        font-size: 16px
    }

    .indexList-box .button {
        position: absolute;
        right: 0;
        bottom: 0
    }
}

@media (max-width:48em) {
    *+.indexList {
        margin-top: 30px
    }

    .indexList {
        height: auto;
        margin-bottom: -50px
    }

    .indexList-box {
        height: auto;
        margin-bottom: 50px
    }

    .indexList-box-body,
    .indexList-box-img {
        width: 100%
    }

    .indexList-box-title {
        position: relative;
        padding-left: 20px;
        padding-bottom: .7em;
        margin-top: 1em;
        margin-bottom: .7em;
        font-size: 1.1rem
    }

    .indexList-box-title .icon {
        display: block
    }

    .indexList-box .button {
        display: none
    }
}

@media (max-width:20em) {
    .indexList-box-title {
        border-bottom: 0;
        margin-bottom: 0;
        font-size: 1rem
    }
}

.newsList+.newsList {
    border-top: 1px dotted;
    border-color: #cfd0d6
}

.newsList+.newsList a {
    padding-top: 10px
}

.front .newsList+.newsList a {
    padding: 15px 0
}

.newsList a {
    padding-bottom: 10px
}

.newsList a:hover .newsList-title {
    text-decoration: underline
}

.newsList-title {
    font-size: 1.17rem
}

.newsList time {
    padding-top: 2px;
    font-size: 1.1rem;
    font-weight: 500;
    letter-spacing: 0;
    white-space: nowrap;
    margin-right: 50px
}

@media (max-width:48em) {
    .front .newsList+.newsList {
        border-top: 1px dotted #ccc
    }

    .front .newsList time {
        margin-bottom: .5em;
        color: #333;
        font-weight: bold
    }
}

@media (max-width:40em) {

    .newsList-title,
    .newsList time {
        font-size: 1rem
    }
}

@media (min-width:30.0625em) {
    .newsList a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

@media (max-width:30em) {
    .newsList a {
        display: block
    }
}

.newsDetail .date {
    display: block;
    margin-bottom: 2em;
    font-weight: bold
}

.newsDetail {}

.newsDetail h2 {
    position: relative;
    font-size: 1.3rem;
    font-weight: bold;
    padding-bottom: .5em;
    margin-top: .5em;
    margin-bottom: .5em
}

.newsDetail h3 {
    font-weight: bold
}

.newsDetail h2+h2 {
    margin-top: 2.5em
}

.newsDetail p+h2 {
    margin-top: 2rem
}

.newsDetail p+h3 {
    margin-top: 1.5em
}

.newsDetail p {
    line-height: 2
}

.newsDetail p a[href]:not([class]) {
    text-decoration: underline
}

.newsDetail img:not([class]),
.newsDetail p img:not([class]) {
    display: block
}

.newsDetail p+div,
.newsDetail p+p {
    margin-top: 1.8em
}

.newsDetail img {
    margin-bottom: 1.5em
}

.newsDetail .video-container {
    position: relative;
    margin-bottom: 2em;
    padding-top: 56%
}

.newsDetail .video-container iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.postNav {
    display: table;
    width: 100%;
    padding-top: 5em
}

.postNav-all,
.postNav-next,
.postNav-prev {
    display: table-cell;
    vertical-align: middle
}

.postNav-all {
    border: 1px solid #9a9eb6;
    border-width: 0 1px;
    text-align: center;
    padding: 0 1em;
    white-space: nowrap
}

.postNav-next {
    text-align: left
}

.postNav-prev {
    text-align: right
}

@media (min-width:48.0625em) {

    .postNav-all,
    .postNav-next,
    .postNav-prev {
        width: 33.3333%
    }

    .postNav a {
        position: relative;
        line-height: 1
    }

    .postNav a:hover {
        text-decoration: underline
    }
}

@media (max-width:48em) {
    .postNav {
        margin-bottom: 20px
    }

    .postNav-next,
    .postNav-prev {
        width: 50%
    }

    .postNav-all {
        display: none
    }
}

@media (max-width:30em) {
    .postNav a {
        font-size: .9rem
    }
}

[class*=" icon-"],
[class^=icon-] {
    font-family: 'chuoa-icon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    vertical-align: middle
}

.icon-leaf-circle-mono:before {
    display: inline-block;
    width: 1.1em;
    content: url("../../assets/img/common/leaf-circle-mono.svg")
}

.icon-cross-circle-mono:before {
    display: inline-block;
    width: 1.1em;
    content: url("../../assets/img/common/cross-circle-mono.svg")
}

.icon-scissors-circle-mono:before {
    display: inline-block;
    width: 1.1em;
    content: url("../../assets/img/common/scissors-circle-mono.svg")
}

.icon-leaf-circle:before {
    display: inline-block;
    width: 1.1em;
    content: url("../../assets/img/common/leaf-circle.svg")
}

.icon-cross-circle:before {
    display: inline-block;
    width: 1.1em;
    content: url("../../assets/img/common/cross-circle.svg")
}

.icon-scissors-circle:before {
    display: inline-block;
    width: 1.1em;
    content: url("../../assets/img/common/scissors-circle.svg")
}

.icon-calendar:before {
    content: "\e95a"
}

.icon-book-shelf:before {
    content: "\e959"
}

.icon-money-pig:before {
    content: "\e956"
}

.icon-handshake:before {
    content: "\e957"
}

.icon-key:before {
    content: "\e958"
}

.icon-washroom:before {
    content: "\e953"
}

.icon-air-condition:before {
    content: "\e938"
}

.icon-bed:before {
    content: "\e939"
}

.icon-bunkbeds:before {
    content: "\e93a"
}

.icon-chair:before {
    content: "\e93b"
}

.icon-cleaner:before {
    content: "\e93c"
}

.icon-closet:before {
    content: "\e93d"
}

.icon-desk:before {
    content: "\e93e"
}

.icon-cutlery:before {
    content: "\e93f"
}

.icon-elevator:before {
    content: "\e940"
}

.icon-dining-table:before {
    content: "\e941"
}

.icon-Interphone:before {
    content: "\e942"
}

.icon-low-table:before {
    content: "\e943"
}

.icon-kettle:before {
    content: "\e944"
}

.icon-laundry:before {
    content: "\e945"
}

.icon-learning:before {
    content: "\e946"
}

.icon-mail-box:before {
    content: "\e947"
}

.icon-bicycle:before {
    content: "\e948"
}

.icon-light:before {
    content: "\e949"
}

.icon-reception:before {
    content: "\e94a"
}

.icon-refrigerator:before {
    content: "\e94b"
}

.icon-books:before {
    content: "\e94c"
}

.icon-shoes:before {
    content: "\e94d"
}

.icon-shower:before {
    content: "\e94e"
}

.icon-sofa:before {
    content: "\e94f"
}

.icon-toilet:before {
    content: "\e950"
}

.icon-bathroom:before {
    content: "\e951"
}

.icon-can:before {
    content: "\e952"
}

.icon-water-heater:before {
    content: "\e954"
}

.icon-wifi:before {
    content: "\e955"
}

.icon-baloon:before {
    content: "\e932"
}

.icon-blog:before {
    content: "\e933"
}

.icon-dog2:before {
    content: "\e934"
}

.icon-speaker:before {
    content: "\e935"
}

.icon-pencil2:before {
    content: "\e936"
}

.icon-document2:before {
    content: "\e937"
}

.icon-cup:before {
    content: "\e90a"
}

.icon-dog:before {
    content: "\e90b"
}

.icon-hammer:before {
    content: "\e90c"
}

.icon-injection:before {
    content: "\e90d"
}

.icon-scissors2:before {
    content: "\e90e"
}

.icon-shop:before {
    content: "\e90f"
}

.icon-wheelchair:before {
    content: "\e928"
}

.icon-angle-bottom-circle-border:before {
    content: "\e909"
}

.icon-angle-right-circle-border:before {
    content: "\e92f"
}

.icon-angle-top-circle-border:before {
    content: "\e930"
}

.icon-angle-left-circle-border:before {
    content: "\e931"
}

.icon-medal:before {
    content: "\e904"
}

.icon-change:before {
    content: "\e905"
}

.icon-note:before {
    content: "\e906"
}

.icon-tv:before {
    content: "\e907"
}

.icon-building2:before {
    content: "\e908"
}

.icon-pdf:before {
    content: "\e900"
}

.icon-angle-right:before {
    content: "\e910"
}

.icon-angle-bottom:before {
    content: "\e901"
}

.icon-angle-left:before {
    content: "\e902"
}

.icon-angle-top:before {
    content: "\e903"
}

.icon-arrow-left:before {
    content: "\e911"
}

.icon-arrow-right:before {
    content: "\e929"
}

.icon-arrow-top:before {
    content: "\e92a"
}

.icon-arrow-bottom:before {
    content: "\e92b"
}

.icon-book:before {
    content: "\e912"
}

.icon-building:before {
    content: "\e913"
}

.icon-clock:before {
    content: "\e914"
}

.icon-cross:before {
    content: "\e915"
}

.icon-document:before {
    content: "\e916"
}

.icon-envelop:before {
    content: "\e917"
}

.icon-heart:before {
    content: "\e918"
}

.icon-leaf:before {
    content: "\e919"
}

.icon-map-pin:before {
    content: "\e91a"
}

.icon-necktie:before {
    content: "\e91b"
}

.icon-pencil:before {
    content: "\e91c"
}

.icon-phd:before {
    content: "\e91d"
}

.icon-phone:before {
    content: "\e91e"
}

.icon-plane:before {
    content: "\e91f"
}

.icon-scissors:before {
    content: "\e920"
}

.icon-user:before {
    content: "\e921"
}

.icon-pagetop:before {
    content: "\e922"
}

.icon-line:before {
    content: "\e923"
}

.icon-window:before {
    content: "\e924"
}

.icon-balloon:before {
    content: "\e925"
}

.icon-check:before {
    content: "\e926"
}

.icon-angle-bottom-circle:before {
    content: "\e927"
}

.icon-angle-right-circle:before {
    content: "\e92c"
}

.icon-angle-left-circle:before {
    content: "\e92d"
}

.icon-angle-top-circle:before {
    content: "\e92e"
}

.icon-facebook:before {
    content: "\ea90"
}

.icon-twitter:before {
    content: "\ea96"
}

.icon-black {
    color: #000
}

.icon-blue {
    color: #4cbb8c
}

.icon-green {
    color: #32d5b6
}

.icon-pink {
    color: #f6438a
}

.icon-white {
    color: #fff
}

.icon-grey {
    color: #9a9eb6
}

.icon-sm {
    font-size: .9em
}

.icon-md {
    font-size: 1em
}

.icon-lg {
    font-size: 1.2em
}

.icon-xl {
    font-size: 1.5em
}

.section-heading {
    font-weight: bold;
    border-bottom: 1px solid;
    border-color: #afb3c7
}

.section-heading span {
    display: inline-block;
    padding-left: .5em
}

.section-heading .icon {
    margin: -2px .5em 0 0;
    font-size: 1em
}

.section-subheading {
    font-weight: bold;
    color: #6f748f;
    margin-bottom: 10px
}

.list+.section-subheading,
.table+.section-subheading,
p:not([class])+.section-subheading,
table:not([class])+.section-subheading,
ul:not([class])+.section-subheading {
    margin-top: 2em
}

.section-hero {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.section-banner a {
    display: block
}

.section-banner img {
    margin-left: auto;
    margin-right: auto
}

@media (min-width:48.0625em) {
    .section-banner img {
        -webkit-transition: opacity 0.3s;
        transition: opacity 0.3s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .section-banner a:hover img {
        opacity: .6
    }
}

@media (min-width:40.0625em) {
    .section-copy {
        font-size: 1.57rem;
        margin-bottom: 45px;
        text-align: center
    }

    .section-hero+p {
        margin-top: 60px
    }

    p+.section-hero {
        margin-top: 50px
    }

    .section-heading {
        font-size: 1.38rem;
        margin-bottom: 30px
    }

    .section-heading {
        margin-top: 100px
    }

    .section-subheading {
        font-size: 1.23rem
    }

    .section-banner a:hover img {
        opacity: .6
    }

    section.anchor {
        padding-top: 58px;
        margin-top: -58px
    }
}

@media (max-width:40em) {
    .section-copy {
        font-size: 1.4rem;
        margin-bottom: 20px
    }

    .section-hero+p {
        margin-top: 2em
    }

    p+.section-hero {
        margin-top: 2em
    }

    .section-heading {
        font-size: 1.25rem;
        margin-bottom: 1em
    }

    section+section>.section-heading {
        margin-top: 60px
    }

    .section-subheading {
        font-size: 1.15rem
    }

    section.anchor {
        padding-top: 27px;
        margin-top: -27px
    }
}
h4+p,
h4+table {
    margin-top: .5em
}

ul+.section-heading {
    margin-top: 2em
}

.text-left {
    text-align: left
}

.text-center {
    text-align: center
}

.text-right {
    text-align: right
}

.text-nowrap {
    white-space: nowrap
}

.text-lowercase {
    text-transform: lowercase
}

.text-uppercase {
    text-transform: uppercase
}

.text-capitalize {
    text-transform: capitalize
}

.text-bold {
    font-weight: bold
}

.text-normal {
    font-weight: normal
}

.text-sm {
    font-size: .9rem
}

.text-md {
    font-size: 1rem
}

.text-lg {
    font-size: 1.2rem
}

.text-xl {
    font-size: 1.5rem
}

.text-caution {
    color: #FF3300
}

.text-pink {
    color: #f6438a
}

.text-blue {
    color: #4cbb8c
}

.text-green {
    color: #2dc4a9
}

.text-grey {
    color: #6f748f
}

.text-dark-grey {
    color: #737477
}

.text-white {
    color: #fff
}

.text-underline {
    text-decoration: underline
}

.text-w3em {
    display: inline-block;
    width: 3em;
    white-space: nowrap
}

.hankaku {
    display: inline-block;
    padding-left: .5em
}

@media (max-width:30em) {
    .text-left-sp {
        text-align: left
    }

    .text-right-sp {
        text-align: right
    }

    .text-center-sp {
        text-align: center
    }
}

.list-unstyled>li {
    list-style-type: none
}

.list-disc {
    padding-left: 1.2em
}

.list-disc>li {
    list-style-type: disc
}

.list-disc.is-grey {
    padding-left: 1.2em
}

.list-disc.is-grey>li {
    list-style-type: disc;
    color: #6f748f
}

.list-disc.is-grey>li span {
    color: #000
}

.list-decimal {
    padding-left: 1.4em
}

.list-decimal>li {
    list-style-type: decimal
}

.list-num {
    counter-reset: circle-numbering
}

.list-num>li {
    position: relative;
    line-height: 1.8;
    list-style-type: none;
    padding-left: 35px
}

.list-num>li:before {
    content: counter(circle-numbering, decimal);
    counter-increment: circle-numbering;
    font-size: 16px;
    line-height: 25px;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 2px;
    width: 25px;
    height: 25px;
    padding-left: 1px;
    text-align: center;
    color: #fff;
    background: #000;
    border-radius: 50%
}

.list-num>li+li {
    margin-top: 1.2em
}

.list-num.is-grey>li:before {
    background: #6f748f
}

.list-slash>li {
    display: inline-block
}

.list-slash>li+li:before {
    content: '/';
    padding-right: 5px
}

.list.has-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media (min-width:40.0625em) {
    .list.has-col.col3:after {
        content: '';
        width: 31%
    }

    .list.col3>li {
        width: 31%
    }

    .list.col2>li {
        width: 48.5%
    }
}

@media (max-width:40em) {
    .list.col3>li {
        width: 45%
    }
}

@media (max-width:30em) {
    .list.col3>li {
        width: 100%
    }
}

.button {
    position: relative;
    line-height: 1.4;
    display: inline-block;
    letter-spacing: .08em;
    text-transform: capitalize;
    text-align: center;
    padding: .8em 0;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    color: #000;
    cursor: pointer;
    background: transparent;
    overflow: hidden
}

.button-xl {
    display: block;
    max-width: 540px
}

.button-lg {
    display: block
}

.button-md {
    width: 240px
}

.button-sm {
    font-size: 1rem
}

.button-inline {
    margin-left: 0
}

.button-block {
    display: block
}

.button.has-side-blank {
    padding: .8em 4em
}

.button.has-border {
    border: 1px solid;
    border-color: #000
}

.button.has-border.button-blue {
    border-color: #4cbb8c
}

.button.has-border.button-pink {
    border-color: #f6438a
}

.button.has-border.button-green {
    border-color: #32d5b6
}

.button.has-border.button-red {
    border-color: #e24a61;
    color: #e24a61
}

.button.has-bg {
    color: #fff
}

.button.has-bg.button-blue {
    background-color: #4cbb8c
}

.button.has-bg.button-pink {
    background-color: #f6438a
}

.button.has-bg.button-green {
    background-color: #32d5b6
}

.button.has-bg.button-red {
    background-color: #e24a61
}

.button.has-hover-bg:hover {
    color: #fff;
    background-color: #000
}

.button.has-hover-bg.button-blue:hover {
    background-color: #4cbb8c
}

.button.has-hover-bg.button-pink:hover {
    background-color: #f6438a
}

.button.has-hover-bg.button-green:hover {
    background-color: #32d5b6
}

.button span {
    position: relative;
    z-index: 1
}

.button span+.icon {
    position: absolute;
    top: 50%;
    right: 1em;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: .9em
}

.button span .icon {
    margin-right: .5em
}

@media (min-width:48.0625em) {
    .button {
        -webkit-transition: .4s;
        transition: .4s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1)
    }

    .button span+.icon {
        -webkit-transition: opacity 0.4s, -webkit-transform 0.4s;
        transition: opacity 0.4s, -webkit-transform 0.4s;
        transition: transform 0.4s, opacity 0.4s;
        transition: transform 0.4s, opacity 0.4s, -webkit-transform 0.4s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .button:hover span+.icon {
        -webkit-animation: hover 0.4s 1 forwards;
        animation: hover 0.4s 1 forwards
    }

    .button.invert:hover {
        color: #000
    }

    .button.has-border.button-black:hover {
        border-color: #000
    }

    .button.has-border.button-blue:hover {
        border-color: #4cbb8c
    }

    .button.has-border.button-pink:hover {
        border-color: #f6438a
    }

    .button.has-border.button-green:hover {
        border-color: #32d5b6
    }
}

@media (min-width:40.0625em) {
    .button-lg {
        display: block;
        max-width: 370px
    }
}

@media (max-width:20em) {
    .button {
        font-size: .9rem
    }
}

@-webkit-keyframes hover {
    0% {
        opacity: 1;
        -webkit-transform: translate(0px, -50%);
        transform: translate(0px, -50%)
    }

    50% {
        opacity: 0;
        -webkit-transform: translate(15px, -50%);
        transform: translate(15px, -50%)
    }

    51% {
        opacity: 0;
        -webkit-transform: translate(-15px, -50%);
        transform: translate(-15px, -50%)
    }

    to {
        opacity: 1;
        -webkit-transform: translate(0px, -50%);
        transform: translate(0px, -50%)
    }
}

@keyframes hover {
    0% {
        opacity: 1;
        -webkit-transform: translate(0px, -50%);
        transform: translate(0px, -50%)
    }

    50% {
        opacity: 0;
        -webkit-transform: translate(15px, -50%);
        transform: translate(15px, -50%)
    }

    51% {
        opacity: 0;
        -webkit-transform: translate(-15px, -50%);
        transform: translate(-15px, -50%)
    }

    to {
        opacity: 1;
        -webkit-transform: translate(0px, -50%);
        transform: translate(0px, -50%)
    }
}

.img-center {
    display: block;
    margin: auto;
    text-align: center
}

.img-wrapper {
    position: relative;
    overflow: hidden
}

@media (min-width:68.8125em) {
    .img-lg {
        max-width: 515px
    }
}

@media (max-width:80em) {
    .img-lg {
        max-width: 50%
    }
}

@media (min-width:48.0625em) {
    .img-left {
        float: left;
        margin: 1.25em 1.25em 0 0
    }

    .img-right {
        float: right;
        margin: 0 0 1.25em 1.25em
    }

    .img-sm {
        max-width: 320px
    }
}

@media (max-width:48em) {

    .img-left,
    .img-right {
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 1.5em;
        text-align: center
    }

    .img-lg {
        max-width: 100%
    }
}

table {
    width: 100%
}

table+table {
    margin-top: 2em
}

table caption {
    font-weight: bold;
    text-align: left;
    margin-bottom: .5em
}

.td-grey,
.th-grey {
    background: #e7e8ee
}

.td-dark-grey,
.th-dark-grey {
    background: #afb3c7
}

.td-nowrap,
.th-nowrap {
    white-space: nowrap
}

.td-v-middle,
.th-v-middle {
    vertical-align: middle
}

.table-bordered {
    border-bottom: 1px solid #afb3c7
}

.table-bordered th {
    font-weight: bold;
    text-align: left
}

@media (min-width:40.0625em) {
    .table-bordered {
        border-collapse: collapse
    }

    table td,
    table th {
        padding: 1.2em 1.5em
    }

    .table-bordered td,
    .table-bordered th {
        border: 1px solid #afb3c7
    }

    .table-bordered th {
        width: 33.64%
    }

    .table-multiple th {
        width: 15.42056%
    }
}

@media (max-width:40em) {

    table td,
    table th {
        padding: 1em 1.25em
    }

    .table-responsive td,
    .table-responsive th {
        display: block
    }

    .table-bordered td,
    .table-bordered th {
        border: solid #afb3c7
    }

    .table-bordered th {
        border-width: 1px
    }

    .table-bordered td {
        border-width: 1px
    }

    .table-bordered.table-responsive td {
        border-width: 0 1px
    }
}

.inner {
    position: relative;
    margin-right: auto;
    margin-left: auto
}

.inner-default {
    max-width: 1250px
}

.inner-large {
    max-width: 1280px
}

.tb-blank {
    padding-top: 100px;
    padding-bottom: 100px
}

.t-blank {
    padding-top: 100px
}

.b-blank {
    padding-bottom: 100px
}

.inside-blank {
    padding-right: 6.2%;
    padding-left: 6.2%
}

.side-blank {
    margin-right: 6.2%;
    margin-left: 6.2%
}

@media (max-width:40em) {
    .tb-blank {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .t-blank {
        padding-top: 60px
    }

    .b-blank {
        padding-bottom: 60px
    }

    .inside-blank {
        padding-right: 20px;
        padding-left: 20px
    }

    .side-blank {
        margin-right: 20px;
        margin-left: 20px
    }
}

@media (min-width:48.0625em) {
    .break-pc {
        display: block !important
    }

    .break-sp {
        display: none !important
    }
}

@media (max-width:48em) {
    .break-pc {
        display: none !important
    }

    .break-sp {
        display: block !important
    }
}

.bg-grey {
    background: #e7e8ee
}

.clf {
    *zoom: 1
}

.clf:after,
.clf:before {
    line-height: 0;
    display: table;
    content: ''
}

.clf:after {
    clear: both
}

@media (min-width:48.0625em) {
    .has-hover-border-link {
        position: relative;
        display: block;
        overflow: hidden;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .hover-border {
        position: absolute;
        background-color: #32d5b6;
        z-index: 1;
        -webkit-transition: -webkit-transform .4s;
        transition: -webkit-transform .4s;
        transition: transform .4s;
        transition: transform .4s, -webkit-transform .4s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .hover-border-bottom,
    .hover-border-top {
        width: calc(100% - 2vw);
        height: 2px
    }

    .hover-border-left,
    .hover-border-right {
        width: 2px;
        height: calc(100% - 2vw)
    }

    .hover-border-top {
        top: 1vw;
        left: 1vw;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: top right;
        transform-origin: top right
    }

    .hover-border-right {
        bottom: 1vw;
        right: 1vw;
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: bottom right;
        transform-origin: bottom right
    }

    .hover-border-bottom {
        right: 1vw;
        bottom: 1vw;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: bottom left;
        transform-origin: bottom left
    }

    .hover-border-left {
        top: 1vw;
        left: 1vw;
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: top left;
        transform-origin: top left
    }

    .has-hover-border-link:hover .hover-border-top {
        right: 1vw;
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transform-origin: top left;
        transform-origin: top left
    }

    .has-hover-border-link:hover .hover-border-right {
        bottom: 1vw;
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: top right;
        transform-origin: top right
    }

    .has-hover-border-link:hover .hover-border-bottom {
        left: 1vw;
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transform-origin: bottom right;
        transform-origin: bottom right
    }

    .has-hover-border-link:hover .hover-border-left {
        top: 1vw;
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom left;
        transform-origin: bottom left
    }
}

@media (min-width:48.0625em) {
    .hover-opacity {
        -webkit-transition: opacity 0.4s;
        transition: opacity 0.4s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .hover-opacity:hover {
        opacity: .6
    }
}

@media (min-width:48.0625em) {
    .visible-sp {
        display: none !important
    }
}

@media (max-width:48em) {
    .visible-pc {
        display: none !important
    }
}

.video-container {
    position: relative;
    padding-top: 56.25%
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.mt0 {
    margin-top: 0 !important
}

.mt05em {
    margin-top: .5em !important
}

.mt1em {
    margin-top: 1em !important
}

.mt2em {
    margin-top: 2em !important
}

.mt3em {
    margin-top: 3em !important
}

.mt4em {
    margin-top: 4em !important
}

.mt5em {
    margin-top: 5em !important
}

.mt6em {
    margin-top: 6em !important
}

.mt7em {
    margin-top: 7em !important
}

.mt8em {
    margin-top: 8em !important
}

.mt9em {
    margin-top: 9em !important
}

.mt10em {
    margin-top: 10em !important
}

.mt0 {
    margin-top: 0 !important
}

.mt05rem {
    margin-top: .5rem !important
}

.mt1rem {
    margin-top: 1rem !important
}

.mt2rem {
    margin-top: 2rem !important
}

.mt3rem {
    margin-top: 3rem !important
}

.mt4rem {
    margin-top: 4rem !important
}

.mt5rem {
    margin-top: 5rem !important
}

.mt6rem {
    margin-top: 6rem !important
}

.mt7rem {
    margin-top: 7rem !important
}

.mt8rem {
    margin-top: 8rem !important
}

.mt9rem {
    margin-top: 9rem !important
}

.mt10rem {
    margin-top: 10rem !important
}

.mb0 {
    margin-bottom: 0 !important
}

.mb05em {
    margin-bottom: .5em !important
}

.mb1em {
    margin-bottom: 1em !important
}

.mb2em {
    margin-bottom: 2em !important
}

.mb3em {
    margin-bottom: 3em !important
}

.mb4em {
    margin-bottom: 4em !important
}

.mb5em {
    margin-bottom: 5em !important
}

.mb6em {
    margin-bottom: 6em !important
}

.mb7em {
    margin-bottom: 7em !important
}

.mb8em {
    margin-bottom: 8em !important
}

.mb9em {
    margin-bottom: 9em !important
}

.mb10em {
    margin-bottom: 10em !important
}

.mb0 {
    margin-bottom: 0 !important
}

.mb05em {
    margin-bottom: .5rem !important
}

.mb1rem {
    margin-bottom: 1rem !important
}

.mb2rem {
    margin-bottom: 2rem !important
}

.mb3rem {
    margin-bottom: 3rem !important
}

.mb4rem {
    margin-bottom: 4rem !important
}

.mb5rem {
    margin-bottom: 5rem !important
}

.mb6rem {
    margin-bottom: 6rem !important
}

.mb7rem {
    margin-bottom: 7rem !important
}

.mb8rem {
    margin-bottom: 8rem !important
}

.mb9rem {
    margin-bottom: 9rem !important
}

.mb10rem {
    margin-bottom: 10rem !important
}

.formHeader {
    margin-bottom: 40px
}

.formFlow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative;
    width: 86%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
    counter-reset: form-flow-counter
}

.formFlow:after {
    display: block;
    content: '';
    position: absolute;
    top: 18px;
    left: 0;
    right: 0;
    height: 1px;
    width: 67%;
    margin: auto;
    background: #9a9eb6
}

.formFlow li {
    position: relative;
    width: 33.3333%;
    color: #9a9eb6;
    text-align: center;
    white-space: nowrap
}

.formFlow li.current {
    color: #000
}

.formFlow li:before {
    position: relative;
    z-index: 1;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5px;
    width: 30px;
    height: 30px;
    border: 1px solid;
    border-color: #9a9eb6;
    background: #fff;
    content: counter(form-flow-counter);
    counter-increment: form-flow-counter;
    font-size: 17px;
    font-weight: bold;
    line-height: 30px
}

.formFlow li.current:before {
    border-color: #000;
    background: #000;
    color: #fff
}

.form-box+.form-box {
    border-top: 1px solid #e7e8ee
}

.form-box:first-of-type {
    border-top: 1px solid #9a9eb6
}

.form-box:last-of-type {
    border-bottom: 1px solid #9a9eb6
}

.form-text {
    white-space: nowrap
}

.form-text .optional,
.form-text .require {
    padding: .5em;
    margin-right: 1em;
    border: 1px solid #000;
    font-size: .9rem
}

.form-text .require {
    background: #000;
    color: #fff
}

.form-text .optional {
    color: #000
}

.form-text .note {
    display: block;
    padding-left: 5em
}

.form-input .grade li {
    margin-top: .5em
}

.form-input .select {
    position: relative;
    display: inline-block
}

.form-input .select .icon {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: -1;
    right: 10px;
    font-size: 13px;
    cursor: pointer
}

.form-input select[name=grade2] {
    margin: 0 .5em
}

.form-input select[name=school_category] {
    width: 150px
}

.form-input input[name=school_name] {
    margin-top: 1em
}

.form-input select[name=companion_type] {
    display: block;
    margin-top: .6em
}

.form-input input[name=companion_number] {
    display: block;
    margin-top: 1em;
    width: 6em
}

.form-input .slash {
    display: inline-block;
    margin: 0 5px
}

.form-block+.form-block {
    margin-top: 1em
}

.form-inline {
    display: inline-block;
    margin-right: 1.5em
}

.form .caution,
.form .error {
    display: block;
    margin-top: .6em;
    color: #FF3300;
    font-size: .9rem
}

.form .button {
    width: 300px;
    max-width: 100%;
    padding: 1em 0;
    margin-top: 50px;
    font-size: 1rem;
    outline: none
}

.form .button input {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0
}

.form-back {
    text-align: center;
    margin-top: 2em
}

.form-back a {
    text-decoration: underline
}

.confirm {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto
}

.thanks .message {
    margin-bottom: 50px;
    text-align: center
}

.thanks .message span {
    display: block
}

.thanks .message .en {
    font-size: 3rem;
    font-weight: 500;
    text-transform: uppercase
}

.thanks .message .ja {
    font-size: 15px;
    font-weight: bold;
    letter-spacing: .4em
}

.thanks .tel {
    margin-top: 40px;
    font-size: 1.57rem;
    font-weight: bold;
    text-align: center
}

@media (min-width:68.8125em) {
    .formHeader {
        text-align: center
    }

    .form-box {
        display: table;
        width: 100%;
        padding: 15px 0
    }

    .form-input,
    .form-text {
        display: table-cell;
        vertical-align: middle
    }

    .form-text {
        width: 310px
    }

    .form .button:hover {
        color: #fff;
        background: #000;
        border-color: #000
    }
}

@media (max-width:68.75em) {
    .form-box {
        padding: 20px 0
    }

    .form-text {
        margin-bottom: 1em
    }
}

@media (min-width:40.0625em) {
    .form-input .list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .form-input .list li {
        width: 48.5%
    }
}

@media (min-width:30.0625em) {
    .form-input select[name=birth_year] {
        width: 100px
    }

    .form-input select[name=birth_day],
    .form-input select[name=birth_month] {
        width: 70px
    }

    .form-input input[name=zip] {
        width: 10em
    }

    .form-input select[name=prefecture] {
        width: 150px;
        margin-left: 1em
    }

    .form-input .event-schedule select,
    .form-input select[name=course] {
        width: 200px
    }

    .thanks {
        text-align: center
    }
}

@media (max-width:30em) {

    .form-input .select.course,
    .form-input .select.course,
    .form-input .select.event-schedule,
    .form-input .select.grade,
    .form-input .select.prefecture,
    .form-input .select.school_category {
        display: block;
        width: 100%
    }

    .form-input .select.prefecture {
        margin-top: 1em
    }

    .form-input select[name=birth_year] {
        width: 70px
    }

    .form-input select[name=birth_day],
    .form-input select[name=birth_month] {
        width: 60px
    }

    .form-input input[name=zip],
    .form-input select[name=school_category] {
        width: 100%
    }

    .form-text .optional,
    .form-text .require {
        font-size: .7rem
    }
}

input[type=radio] {
    display: none
}

input[type=radio]:checked+.radio-text {
    color: #4cbb8c
}

input[type=radio]:checked+.radio-text:before {
    border-color: #4cbb8c
}

input[type=radio]:checked+.radio-text:after {
    opacity: 1
}

.radio-text {
    position: relative;
    padding-left: 25px;
    -webkit-transition: color 0.2s;
    transition: color 0.2s
}

.radio-text:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 15px;
    height: 15px;
    border: 1px solid;
    border-color: #9a9eb6;
    border-radius: 50%;
    -webkit-transition: border-color 0.2s;
    transition: border-color 0.2s
}

.radio-text:after {
    display: block;
    position: absolute;
    top: 3px;
    left: 3px;
    width: 11px;
    height: 11px;
    background: #4cbb8c;
    border-radius: 50%;
    content: "";
    opacity: 0;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s
}

input[type=checkbox] {
    display: none
}

input[type=checkbox]:checked+.checkbox-text {
    color: #4cbb8c
}

input[type=checkbox]:checked+.checkbox-text:before {
    border-color: #4cbb8c
}

input[type=checkbox]:checked+.checkbox-text:after {
    opacity: 1
}

.checkbox-text {
    position: relative;
    padding-left: 25px;
    -webkit-transition: color 0.2s;
    transition: color 0.2s
}

.checkbox-text:before {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 15px;
    height: 15px;
    border: 1px solid;
    border-color: #9a9eb6;
    border-radius: 3px;
    content: "";
    -webkit-transition: border-color 0.2s;
    transition: border-color 0.2s
}

.checkbox-text:after {
    display: block;
    position: absolute;
    top: 1px;
    left: 5px;
    width: 6px;
    height: 9px;
    -webkit-transform: rotate(40deg);
    transform: rotate(40deg);
    border: solid #4cbb8c;
    border-width: 0 2px 2px 0;
    content: "";
    opacity: 0;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s
}

.front-section-heading {
    line-height: 1;
    text-align: center;
    margin-bottom: 1em
}

.front-section-heading .en {
    display: block;
    font-size: 3.07rem;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0
}

.front-section-heading .ja {
    position: relative;
    display: inline-block;
    font-size: 1rem;
    font-weight: bold;
    letter-spacing: .25em;
    text-indent: .25em;
    vertical-align: middle;
    margin-bottom: 14px
}

.front-section-heading .ja:after {
    position: absolute;
    display: block;
    content: '';
    width: 100%;
    height: 2px;
    left: 0;
    right: 0;
    bottom: -10px;
    margin: 0 auto
}

.front-section-heading.has-border-blue .ja:after {
    background: #4cbb8c
}

.front-section-heading.has-border-pink .ja:after {
    background: #f6438a
}

.front-section-heading.has-border-green .ja:after {
    background: #32d5b6
}

@media (min-width:40.0625em) {
    .front-section-heading .en {
        font-size: 3.07rem
    }
}

@media (max-width:40em) {
    .front-section-heading .en {
        font-size: 2.5rem
    }

    .front-section-heading .ja {
        margin-bottom: 18px
    }
}

.mainVisual {
    position: relative;
    height: 100vh;
    overflow: hidden
}

.mainVisual:before {
    position: absolute;
    display: block;
    content: '';
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../../assets/img/common/dot-white.png);
    background-repeat: repeat
}

.mainVisual-copy {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 2;
    width: 87%;
    max-width: 1250px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    line-height: 1;
    -webkit-transform: translateY(-80%);
    transform: translateY(-80%);
    visibility: hidden
}

.mainVisual-copy-border {
    width: 610px;
    height: 2px;
    background: #32d5b6;
    margin: 10px auto 22px;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: -webkit-transform 0.9s;
    transition: -webkit-transform 0.9s;
    transition: transform 0.9s;
    transition: transform 0.9s, -webkit-transform 0.9s;
    -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
    transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.mainVisual-copy-text {
    line-height: 1;
    overflow: hidden
}

.mainVisual-copy .en {
    font-size: 64px;
    letter-spacing: .1em;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: -webkit-transform 0.8s;
    transition: -webkit-transform 0.8s;
    transition: transform 0.8s;
    transition: transform 0.8s, -webkit-transform 0.8s;
    -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
    transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.mainVisual-copy .ja {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: .12em;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: -webkit-transform 1s;
    transition: -webkit-transform 1s;
    transition: transform 1s;
    transition: transform 1s, -webkit-transform 1s;
    -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
    transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.mainVisual-img-items {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%
}

.mainVisual-img {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-position: 50%;
    background-size: cover;
    background-repeat: no-repeat
}

@media (max-width:68.75em) {
    .mainVisual-copy .en {
        font-size: 44px
    }

    .mainVisual-copy .ja {
        font-size: 12px
    }
}

@media (min-width:48.0625em) {
    .mainVisual-img1 {
        background-image: url(../../assets/img/page/front/main-visual01.jpg)
    }

    .mainVisual-img2 {
        background-image: url(../../assets/img/page/front/main-visual02.jpg)
    }

    .mainVisual-img3 {
        background-image: url(../../assets/img/page/front/main-visual03.jpg)
    }

    .mainVisual-img4 {
        background-image: url(../../assets/img/page/front/main-visual04.jpg)
    }
}

@media (max-width:48em) {
    .mainVisual-img1 {
        background-image: url(../../assets/img/page/front/main-visual01-sp.jpg)
    }

    .mainVisual-img2 {
        background-image: url(../../assets/img/page/front/main-visual02-sp.jpg)
    }

    .mainVisual-img3 {
        background-image: url(../../assets/img/page/front/main-visual03-sp.jpg)
    }

    .mainVisual-img4 {
        background-image: url(../../assets/img/page/front/main-visual04-sp.jpg)
    }

    .mainVisual-copy {
        max-width: 100%
    }

    .mainVisual-copy-border {
        width: 100%
    }

    .mainVisual-copy .en {
        font-size: 8vw
    }

    .mainVisual-copy .ja {
        font-size: .9rem
    }
}

@media (max-width:40em) {
    .mainVisual-copy {
        top: 55%
    }

    .mainVisual-copy-border {
        margin-bottom: 17px
    }
}

.frontAnnouce {
    position: relative
}

.frontAnnouce-container {
    position: relative;
    z-index: 2;
    background: #fff;
    border: 1px solid #f6438a
}

.frontAnnouce-circleBanner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    z-index: 2;
    top: -218px;;
    right: 5.2%
}

.frontAnnouce-circleBanner a {
    display: block;
    width: 260px;
    border-radius: 50%;
    background-color: #fff
}

.frontAnnouce-circleBanner .primary,
.frontAnnouce-circleBanner .secondary {
    width: 200px;
}

.frontAnnouce-circleBanner .primary {
    margin-right: 0px
}

.frontAnnouce-circleBanner .secondary {
    position: relative;
    z-index: 1;
    right: 15px;
}

.frontAnnouce-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.frontAnnouce-note {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    z-index: -1;
    margin-left: -15px;
    background-color: #f6438a;
    border-radius: 50%;
    color: #fff;
    font-weight: bold;
    text-align: center
}

.frontAnnouce-title {
    font-size: 18px;
    font-weight: bold;
    line-height: 1;
    text-align: center;
}

.frontAnnouce-title .chuoAnimal-festival {
    display: block;
    padding: 0.8em 0;
}

.frontAnnouce-title .chuoAnimal-festival strong {
    margin-left: 15px;
}

.frontAnnouce-title .chuoAnimal-span {
    display: inline-block;
    vertical-align: middle;
    padding: 0 1rem;
    color: #f6438a;
    font-size: 41px;
    font-weight: normal;
    letter-spacing: .08em;
}

.frontAnnouce-detail {
    font-weight: 500;
    text-align: center
}

.frontAnnouce-detail .icon {
    display: inline-block;
    vertical-align: middle;
    margin-right: .25rem;
    margin-top: -2px
}

.frontAnnouce-detail .date .icon {
    font-size: 1.2em
}

.frontAnnouce-detail .time .icon {
    font-size: .7em
}

.frontAnnouce-detail .sat {
    color: #4cbb8c
}

.frontAnnouce-detail .sun {
    color: #f6438a
}

@media (min-width:52.5625em) {
    .frontAnnouce {
        padding-bottom: 40px
    }

    .frontAnnouce-container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-top: -80px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .frontAnnouce-img.sp {
        display: none
    }
}

@media (max-width:52.5em) {
    .frontAnnouce {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .frontAnnouce-container {
        margin-top: 0;
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .frontAnnouce-img.pc {
        display: none
    }

    .frontAnnouce-img {
        margin-top: 1em
    }

    .frontAnnouce-body {
        text-align: center
    }
}

@media (min-width:48.0625em) {
    .frontAnnouce-circleBanner img {
        -webkit-transition: opacity 0.4s;
        transition: opacity 0.4s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .frontAnnouce-circleBanner a:hover img {
        opacity: .6
    }
}

@media (max-width:52.5625em) {
    .frontAnnouce-circleBanner {
        position: relative;
        top: inherit;
        right: inherit;
        margin-top: -180px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 15px;
    }

    .frontAnnouce-circleBanner .primary,
    .frontAnnouce-circleBanner .secondary {
        width: 220px;
        margin-bottom: 20px;
    }

    .frontAnnouce-container {
        margin-top: 5%
    }
}

@media (min-width:40.0625em) {
    .frontAnnouce-img img {
        height: 130px
    }

    .frontAnnouce-note {
        width: 110px;
        height: 110px;
        font-size: 18px
    }

    .frontAnnouce-body {
        padding-left: 20px
    }

    .frontAnnouce-detail {
        padding-top: .3em;
        font-size: 18px
    }

    .frontAnnouce-detail p {
        display: inline-block;
        vertical-align: middle;
        margin: 0 .4em
    }
}

@media (max-width:40em) {
    .frontAnnouce-container {
        padding-top: 30px;
        padding-bottom: 30px;
        padding-left: 1em;
        padding-right: 1em
    }

    .frontAnnouce-img img {
        height: 100px
    }

    .frontAnnouce-note {
        width: 80px;
        height: 80px;
        font-size: 14px
    }

    .frontAnnouce-title {
        font-size: 18px;
        line-height: 1.6
    }

    .frontAnnouce-title .chuoAnimal-festival {
        padding: 0;
    }

    .frontAnnouce-title .chuoAnimal-span {
        display: block;
        font-size: 2.2em;
    }

    .frontAnnouce-detail {
        padding-top: 0.6em;
        padding-bottom: 0;
        font-size: 1.1em
    }
}

@media (max-width:30em) {
    .frontAnnouce-circleBanner {
        margin-top: -45%
    }

    .frontAnnouce-circleBanner .primary,
    .frontAnnouce-circleBanner .secondary {
        width: calc(50% + 10px)
    }

    .frontAnnouce-circleBanner .primary img,
    .frontAnnouce-circleBanner .secondary img {
        width: 100%
    }

    .frontAnnouce-title {
        font-size: 16px
    }
    .frontAnnouce-title .chuoAnimal-festival strong {
        display: block;
        margin-left: 0;
    }
    .frontAnnouce-title .chuoAnimal-span {
        font-size: 2em
    }
}

.frontEvent-container {
    position: relative;
    z-index: 2;
    background: #fff
}

.frontEvent-heading {
    margin-bottom: .7em
}

.frontEvent-head .button {
    display: block;
    margin-top: 1.5em;
    max-width: 180px
}

@media (min-width:80.0625em) {
    .frontEvent-container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .frontEvent-head {
        width: 20%;
        padding-right: 40px
    }

    .frontEvent-body {
        width: 80%
    }
}

@media (max-width:80em) {
    .frontEvent-head {
        text-align: center;
        margin-bottom: 40px
    }

    .frontEvent .button {
        display: none
    }
}

@media (max-width:68.75em) {
    .frontEvent-container {
        margin-top: 0
    }
}

@media (min-width:52.5625em) {
    .frontEvent-container {
        padding: 40px
    }
}

@media (max-width:52.5em) {
    .frontEvent-container {
        padding: 60px 40px
    }

    .frontEvent-head {
        margin-bottom: 1.5em
    }
}

@media (min-width:48.0625em) {
    .frontEvent {
        background: #e7e8ee
    }
}

@media (max-width:48em) {
    .event-section{
        margin-top: 0px;
    }
    .frontEvent {
        padding-top: 5rem;
        padding-bottom: 5rem;
        background: #fff
    }

    .frontEvent-head {
        margin-bottom: 30px
    }

    .frontEvent-container {
        margin-top: 0;
        padding: 0
    }
}

@media (max-width:40em) {
    .frontEvent {
        padding-top: 15%
    }

    .frontEvent-container {
        padding: 0
    }

    .frontEvent-head {
        text-align: left
    }

    .frontEvent-head p br {
        display: none
    }
}

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

.frontPublic-banner {
    width: 29.6%
}

.frontPublic-banner img {
    width: 100%
}

@media (max-width:88.125em) {
    .frontPublic-banner {
        width: 38%
    }
}

@media (max-width:68.75em) {
    .frontPublic-banner {
        width: 70%;
        margin-top: 40px 6.2%;
        margin-left: auto;
        margin-right: auto
    }
}

@media (min-width:48.0625em) {
    .frontPublic-inner {
        padding-top: 80px;
        padding-bottom: 80px
    }
}

@media (max-width:48em) {
    .frontPublic-inner {
        padding-top: 5rem;
        padding-bottom: 5rem
    }
}

@media (max-width:40em) {
    .frontPublic-banner {
        width: 100%
    }

    .frontPublic .button {
        display: block;
        max-width: 240px;
        margin: auto
    }
}

.frontNews {
    position: relative;
    width: 70.4%;
    padding-right: 40px
}

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

.frontNews-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 30px
}

.frontNews-heading {
    border-right: 1px solid #4cbb8c;
    padding-right: 27px;
    margin-right: 27px;
    margin-bottom: 0;
    white-space: nowrap
}

.frontNews-body {
    overflow: hidden
}

.frontNews .button {
    position: absolute;
    top: 0;
    right: 40px;
    width: 160px;
    padding: .7em 0
}

@media (max-width:88.125em) {
    .frontNews {
        width: 60%
    }

    .frontNews .button {
        position: relative;
        width: 250px;
        top: auto;
        right: auto;
        margin-top: 2em;
        padding: .6em 0 .5em;
        margin-left: auto;
        margin-right: auto
    }
}

@media (max-width:68.75em) {
    .frontNews-lead br {
        display: none
    }

    .frontNews {
        width: 100%;
        padding: 5rem 6.2%;
        margin-bottom: 30px;
        background: #fff
    }

    .frontNews-container,
    .frontNews-head {
        display: block
    }

    .frontNews-heading {
        border-right: 0;
        padding-right: 0;
        margin-right: 0;
        margin-bottom: 1em
    }

    .frontNews .button {
        float: right;
        padding: 1em 0
    }
}

@media (max-width:40em) {
    .frontNews {
        padding: 5rem 20px
    }

    .frontNews-body {
        overflow: auto
    }

    .frontNews .button {
        float: none;
        width: 100%
    }
}

.frontCourse-lead {
    margin-bottom: 1.5em;
    text-align: center
}

.frontCourse-boxGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.frontCourse-box {
    width: 33.3333%
}

.frontCourse-box-inner {
    position: relative;
    display: table;
    width: 100%
}

.frontCourse-link {
    position: relative;
    overflow: hidden
}

.frontCourse-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat
}

.biyou .frontCourse-img {
    background-image: url(../../assets/img/page/front/course-biyou.jpg)
}

.kango .frontCourse-img {
    background-image: url(../../assets/img/page/front/course-kango.jpg)
}

.kyosei .frontCourse-img {
    background-image: url(../../assets/img/page/front/course-kyosei.jpg)
}

.frontCourse-mask {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    width: 74.46%;
    height: 78.78%;
    margin: 0 auto;
    background-image: url(../../assets/img/common/dot-black.png);
    background-repeat: repeat
}

.biyou .frontCourse-mask {
    background-color: rgba(246, 67, 138, 0.6)
}

.kango .frontCourse-mask {
    background-color: rgba(56, 115, 237, 0.6)
}

.kyosei .frontCourse-mask {
    background-color: rgba(50, 213, 182, 0.6)
}

.frontCourse-body {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    color: #fff;
    display: table;
    padding: 0 12.25%;
    margin: 0 auto
}

.frontCourse-body p {
    color: #fff;
    font-weight: bold
}

.frontCourse-body-inner {
    display: table-cell;
    vertical-align: middle;
    padding: 4% 7%
}

.frontCourse-name {
    font-size: 1.69rem;
    font-weight: bold;
    line-height: 1.5;
    margin-bottom: 30px
}

.frontCourse-name .icon {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
    width: 45px;
    height: 45px;
    font-size: 45px;
    line-height: 1
}

.frontCourse-link {
    position: relative;
    display: block
}

@media (min-width:80.0625em) {
    .frontCourse-link {
        padding-top: 142.060%
    }

    .frontCourse-name {
        font-size: 1.69rem;
        text-align: center
    }

    .frontCourse-img {
        height: 100%
    }
}

@media (max-width:80em) {
    .frontCourse-name {
        font-size: 1.5rem;
        margin-bottom: 20px
    }

    .frontCourse-link {
        padding-top: 142.060%
    }
}

@media (max-width:68.75em) {
    .frontCourse-boxGroup {
        display: block
    }

    .frontCourse-box {
        width: 100%
    }

    .frontCourse-mask {
        width: 92%;
        height: 88%
    }

    .frontCourse-link {
        padding-top: 60%
    }

    .frontCourse-body {
        width: 92%
    }

    .frontCourse-name {
        font-size: 1.25rem;
        margin-bottom: 1rem;
        text-align: center
    }
}

@media (min-width:48.0625em) {
    .frontCourse-img {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: -webkit-transform 1s;
        transition: -webkit-transform 1s;
        transition: transform 1s;
        transition: transform 1s, -webkit-transform 1s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .frontCourse-link:hover .frontCourse-img {
        -webkit-transform: scale(1.08);
        transform: scale(1.08)
    }
}

@media (min-width:40.0625em) {
    .frontCourse-lead {
        font-size: 1.69rem;
        margin-bottom: 1.5em
    }
}

@media (max-width:40em) {
    .frontCourse-lead {
        font-size: 1rem;
        margin-bottom: 1em
    }

    .frontCourse-body {
        padding: 0
    }

    .frontCourse-link {
        padding-top: 120%
    }
}

@media (max-width:20em) {
    .frontCourse-link {
        padding-top: 138%
    }
}

.frontQua-heading {
    border-bottom: 1px solid #e7e8ee;
    padding-bottom: .3em;
    margin-bottom: 1em;
    font-size: 1.53rem;
    font-weight: bold;
    white-space: nowrap
}

.frontQua-heading .icon {
    font-size: 130%;
    margin-right: 10px;
    margin-top: -4px
}

.frontQua-container {
    position: relative;
    border: 1px solid #e7e8ee
}

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

.frontQua .button {
    margin-left: auto;
    margin-right: auto
}

@media (min-width:80.0625em) {
    .frontQua-list li {
        width: 25%
    }
}

@media (max-width:80em) {
    .frontQua-list li {
        width: 33%
    }
}

@media (min-width:68.8125em) {
    .frontQua-lead {
        margin-bottom: 2em
    }

    .frontQua .button {
        margin-top: 40px;
        width: 240px
    }
}

@media (max-width:68.75em) {
    .frontQua-lead {
        margin-bottom: 1em
    }

    .frontQua-list li {
        width: 48.5%
    }

    .frontQua .button {
        margin-top: 30px;
        width: 190px
    }
}

@media (min-width:48.0625em) {
    .frontQua-container {
        padding: 40px 70px
    }
}

@media (max-width:48em) {
    .frontQua-container {
        padding: 40px 20px
    }
}

.frontSchool-lead {
    text-align: center;
    margin-bottom: 3em
}

.frontSchool-columnGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.frontSchool-columnGroup+.frontSchool-columnGroup {
    margin-top: 1.5vw
}

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

.frontSchool-parentColumn.first {
    width: 39.04%
}

.frontSchool-parentColumn.second {
    width: 59.36%
}

.frontSchool-box {
    position: relative;
    background: #fff
}

.frontSchool-box.large {
    width: 100%
}

.frontSchool-box.middle {
    width: 65.76%
}

.frontSchool-box.small {
    width: 31.53%
}

.frontSchool-box.admission {
    width: 100%
}

.frontSchool-box.sp {
    display: none
}

.frontSchool-box-heading {
    position: relative;
    z-index: 1;
    font-size: 1.38rem;
    font-weight: bold
}

.frontSchool-box.small .frontSchool-box-heading {
    text-align: center
}

.frontSchool-box-heading.invert {
    color: #fff
}

.frontSchool-box-heading .icon {
    font-size: 65%;
    color: #32d5b6;
    margin: -2px 0 0 .5em
}

.frontSchool-box-heading+p {
    position: relative;
    z-index: 1;
    margin-top: .8em
}

.feature .frontSchool-box-img {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%
}

.overview .frontSchool-box-img,
.teacher .frontSchool-box-img {
    width: 100%;
    height: 100%
}

.access .frontSchool-box-img {
    width: 45%;
    height: 100%
}

.model-dog .frontSchool-box-img {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 100%
}

.graduate .frontSchool-box-img {
    width: 100%;
    height: 100%
}

.frontSchool-box-body {
    z-index: 1
}

.frontSchool-box.small .frontSchool-box-body {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin: auto
}

.feature .frontSchool-box-body,
.model-dog .frontSchool-box-body {
    padding: 2vw 2.5vw 0 2.5vw
}

.access .frontSchool-box-body {
    width: 55%;
    padding: 1vw 0 0 1vw
}

.frontSchool-box-link {
    display: block;
    height: 100%;
    background: #fff
}

.frontSchool-box.small .frontSchool-box-link {
    position: relative;
    height: 100%
}

.frontSchool-box.middle .frontSchool-box-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.frontSchool-box.access .frontSchool-box-link {
    padding: 1vw
}

@media (min-width:68.8125em) {
    .frontSchool-box-heading {
        white-space: nowrap
    }

    .frontSchool-box.graduate,
    .frontSchool-box.model-dog {
        margin-top: 1.5vw
    }

    .admission .frontSchool-box-img,
    .facility .frontSchool-box-img {
        width: 47.95%;
        height: 100%
    }

    .admission .frontSchool-box-body,
    .facility .frontSchool-box-body {
        padding: 2vw 2.5vw 0 2.5vw;
        width: 52.05%
    }
}

@media (max-width:68.75em) {
    .frontSchool-box-heading {
        font-size: 1.2rem
    }

    .frontSchool-columnGroup {
        display: block
    }

    .frontSchool-columnGroup+.frontSchool-columnGroup {
        margin-top: 0
    }

    .frontSchool-parentColumn.first {
        width: 100%;
        margin-bottom: 0
    }

    .frontSchool-parentColumn.second {
        width: 100%
    }

    .frontSchool-box.middle .frontSchool-box-link {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .frontSchool-box.admission .frontSchool-box-link:before,
    .frontSchool-box.facility .frontSchool-box-link:before {
        position: absolute;
        display: block;
        content: '';
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5)
    }

    .frontSchool-box {
        position: relative;
        background: #fff;
        margin-top: 20px
    }

    .frontSchool-box.small {
        width: 48.5%
    }

    .frontSchool-box.middle {
        width: 100%
    }

    .frontSchool-box.pc {
        display: none
    }

    .frontSchool-box.sp {
        display: block
    }

    .frontSchool-box.feature {
        margin-top: 0
    }

    .feature .frontSchool-box-img {
        position: static
    }

    .model-dog .frontSchool-box-img {
        position: static;
        margin-top: 1em
    }

    .admission .frontSchool-box-img,
    .facility .frontSchool-box-img {
        width: 100%;
        height: 100%
    }

    .frontSchool-box.small .frontSchool-box-body {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        left: 0;
        right: 0;
        margin: auto
    }

    .feature .frontSchool-box-body,
    .model-dog .frontSchool-box-body {
        padding: 6vw 4vw 0 4vw
    }

    .access .frontSchool-box-body {
        padding: 4vw
    }

    .frontSchool-box-body p br {
        display: none
    }
}

@media (max-width:40em) {
    .frontSchool-lead {
        text-align: left;
        margin-bottom: 1.6em
    }

    .frontSchool-box {
        margin-top: 15px
    }

    .frontSchool-box-heading {
        font-size: 1.1rem
    }

    .frontSchool-box-heading .icon {
        margin-top: 0
    }
}

@media (max-width:20em) {

    .feature .frontSchool-box-body p,
    .model-dog .frontSchool-box-body p {
        font-size: .9rem
    }

    .access .frontSchool-box-body p {
        display: none
    }
}

.frontDormitory-select-box-link {
    position: relative;
    display: block;
    height: 100%
}

.frontDormitory-select-box-body {
    width: 100%;
    color: #fff;
    font-weight: bold
}

.frontDormitory-select-box-body:before {
    position: absolute;
    display: block;
    content: '';
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../../assets/img/common/dot-black.png);
    background-repeat: repeat
}

.frontDormitory-select-box-img {
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat
}

.frontDormitory-select-box-img.women {
    background-image: url(../../assets/img/page/front/dormitory-shimo.jpg)
}

.frontDormitory-select-box-img.men {
    background-image: url(../../assets/img/page/front/dormitory-ojiryou.jpg)
}

.frontDormitory-select-box-name {
    padding-bottom: 5px;
    margin-bottom: 1rem;
    font-weight: bold
}

.frontDormitory-select-box-name .icon {
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0 0 1em;
    font-size: .7em
}

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

.frontDormitory-feature-box .icon {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
    background: #e7e8ee;
    border-radius: 50%;
    text-align: center
}

.frontDormitory-feature-box-title {
    margin-bottom: 10px;
    font-size: 1.2rem;
    font-weight: bold;
    text-align: center
}

.frontDormitory .button {
    margin-left: auto;
    margin-right: auto;
    max-width: 540px
}

@media (min-width:80.0625em) {
    .frontDormitory-select-box-name {
        border-bottom: 2px solid #fff;
        font-size: 22px
    }

    .frontDormitory-feature {
        margin-top: 50px
    }

    .frontDormitory-feature-box {
        padding: 0 2em
    }

    .frontDormitory-feature-box .icon {
        width: 140px;
        height: 140px;
        font-size: 60px;
        line-height: 140px
    }

    .frontDormitory .button {
        margin-top: 50px
    }
}

@media (max-width:80em) {
    .frontDormitory-select-box-name {
        border-bottom: 1px solid #fff;
        font-size: 1.2rem
    }

    .frontDormitory-feature {
        margin-top: 40px
    }

    .frontDormitory-feature-box {
        padding: 0 1em
    }

    .frontDormitory-feature-box .icon {
        width: 100px;
        height: 100px;
        font-size: 50px;
        line-height: 100px
    }

    .frontDormitory .button {
        margin-top: 40px
    }
}

@media (min-width:68.8125em) {
    .frontDormitory-select {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .frontDormitory-select-box {
        width: 50%
    }
}

@media (min-width:48.0625em) {
    .frontDormitory-select-box-img {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: -webkit-transform 1s;
        transition: -webkit-transform 1s;
        transition: transform 1s;
        transition: transform 1s, -webkit-transform 1s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .frontDormitory-select-box-link:hover .frontDormitory-select-box-img {
        -webkit-transform: scale(1.08);
        transform: scale(1.08)
    }

    .frontDormitory-select-box-link {
        overflow: hidden
    }

    .frontDormitory-feature-box {
        width: 25%
    }
}

@media (max-width:48em) {
    .frontDormitory-feature {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin-bottom: -30px
    }

    .frontDormitory-feature-box {
        width: 50%;
        margin-bottom: 30px
    }
}

@media (min-width:40.0625em) {
    .frontDormitory-lead {
        margin-bottom: 40px;
        text-align: center
    }

    .frontDormitory-select {
        margin-top: 50px
    }

    .frontDormitory-select-box-img {
        height: 430px
    }

    .frontDormitory-select-box-body {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        left: 0;
        right: 0;
        padding: 40px 10%
    }

    .frontDormitory-select-box-body.women {
        background-color: rgba(246, 67, 138, 0.7)
    }

    .frontDormitory-select-box-body.men {
        background-color: rgba(56, 115, 237, 0.7)
    }

    .frontDormitory-select-box-body li {
        font-size: 1.06rem
    }
}

@media (max-width:40em) {
    .frontDormitory-lead {
        margin-bottom: 20px
    }

    .frontDormitory-select {
        margin-top: 30px
    }

    .frontDormitory-select-box:last-child {
        margin-top: 20px
    }

    .frontDormitory-select-box-img {
        padding-top: 56.49351%
    }

    .frontDormitory-select-box-body {
        padding: 28px 7%
    }

    .frontDormitory-select-box-body.women {
        background-color: rgba(246, 67, 138, 0.86)
    }

    .frontDormitory-select-box-body.men {
        background-color: rgba(56, 115, 237, 0.86)
    }
}

@media (max-width:20em) {
    .frontDormitory-feature-box {
        width: 100%
    }
}

.frontSns .inner {
    border-top: 1px solid #ddd
}

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

.frontSns-box {
    width: 31%
}

.frontSns-heading {
    font-size: 2.3rem;
    letter-spacing: 0;
    text-align: center;
    margin-bottom: .25em
}

.frontSns-body {
    border: #e7e8ee solid;
    border-width: 1px;
    height: 350px
}

.facebook .frontSns-body {
    border-width: 1px 0
}

.twitter .frontSns-body {
    border-width: 0 1px
}

.blog .frontSns-body {
    overflow: scroll
}

.postList-item+.postList-item {
    border-top: 1px solid #e7e8ee
}

.postList-link {
    position: relative;
    display: block;
    padding: 20px 50px 20px 20px
}

.postList-title {
    font-size: 16px;
    font-weight: bold;
    color: #4cbb8c
}

.postList-excerpt {
    margin: 1em 0
}

.postList-date {
    display: inline-block;
    margin-right: .5em
}

.postList-category {
    display: inline-block;
    line-height: 1;
    padding: 4px 7px;
    border: 1px solid #e7e8ee;
    border-radius: 4px
}

.postList-icon {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 20px;
    color: #32d5b6
}

@media (min-width:48.0625em) {
    .postList-link {
        -webkit-transition: background .4s;
        transition: background .4s
    }

    .postList-link:hover {
        background: rgba(154, 158, 182, 0.4)
    }

    .postList-link:hover .postList-title {
        text-decoration: underline
    }
}

@media (max-width:48em) {
    .frontSns {
        display: none
    }

    .frontSns-box.facebook,
    .frontSns-box.twitter {
        display: none
    }

    .frontSns-box.blog {
        width: 100%
    }

    .frontSns-body {
        height: auto;
        overflow: auto
    }

    .postList-item:nth-child(4),
    .postList-item:nth-child(5) {
        display: none
    }
}

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

.animalList:before {
    content: "";
    display: block;
    width: 23.1%;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

.animalList:after {
    content: "";
    display: block;
    width: 23.1%
}

.animalList-img {
    margin-bottom: .7em
}

.animalList-img img {
    vertical-align: middle;
    border: 1px solid #acb0c5
}

.animalList-name {
    font-weight: bold;
    text-align: center
}

.animalList-sex {
    text-align: center
}

.animalList-sex .male {
    color: #4cbb8c
}

.animalList-sex .female {
    color: #f6438a
}

.animalList-type {
    text-align: center
}

.mainAnimal {
    position: relative;
    border: 1px solid #acb0c5;
    margin-bottom: 40px
}

.mainAnimal-img img {
    vertical-align: bottom
}

.mainAnimal-body {
    width: 230px;
    text-align: center
}

.mainAnimal-label {
    font-size: 1.23rem;
    font-weight: bold;
    padding: 2px 0;
    background: #e7e8ee;
    max-width: 230px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: .5em
}

.mainAnimal-name {
    font-size: 1.23rem;
    font-weight: bold;
    text-align: center;
    margin-bottom: .5em
}

.mainAnimal-sex {
    display: inline
}

.mainAnimal-sex span[data-sex=男の子] {
    color: #4cbb8c
}

.mainAnimal-sex span[class=female] {
    color: #f6438a
}

.mainAnimal-type {
    display: inline;
    padding-left: .5em
}

@media (min-width:88.1875em) {
    .mainAnimal-img {
        width: 70%
    }
}

@media (max-width:88.125em) {
    .mainAnimal-img {
        width: 60%
    }
}

@media (min-width:68.8125em) {
    .mainAnimal-body {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        right: 9%
    }
}

@media (max-width:68.75em) {
    .mainAnimal-body {
        margin-top: 3em;
        margin-left: auto;
        margin-right: auto
    }

    .mainAnimal-img {
        width: 100%
    }
}

@media (min-width:40.0625em) {
    .animalList-box {
        width: 22.9%;
        margin-bottom: 60px
    }

    .animalList-name {
        font-size: 1.23rem
    }
}

@media (max-width:40em) {
    .animalList-box {
        width: 48.5%;
        margin-bottom: 30px
    }

    .animalList-name {
        font-size: 1rem
    }
}

.otherFacility {
    margin-bottom: 70px
}

.otherFacility-img>img {
    margin-bottom: 10px;
    width: 100%
}

@media (min-width:52.5625em) {
    .otherFacility {
        margin-bottom: 70px
    }

    .otherFacility-container {
        display: table;
        width: 100%
    }

    .otherFacility-body,
    .otherFacility-img {
        display: table-cell;
        vertical-align: top
    }

    .otherFacility-img {
        width: 37%
    }

    .otherFacility-img.is-large {
        width: 48.13084%
    }

    .otherFacility-body {
        padding-left: 0;
        padding-right: 40px
    }

    .otherFacility-img+.otherFacility-body {
        padding-left: 40px
    }
}

@media (max-width:52.5em) {
    .otherFacility {
        margin-bottom: 40px
    }

    .otherFacility-img {
        width: 100%
    }

    .otherFacility-body {
        margin-bottom: 2em
    }

    .otherFacility-img+.otherFacility-body {
        margin-top: 1em;
        margin-bottom: 0
    }
}

*+.schoolFeature {
    margin-top: 70px
}

.schoolFeature {
    counter-reset: feature-counter
}

.schoolFeature-box {
    position: relative
}

.schoolFeature-box-title {
    font-weight: bold
}

.schoolFeature-box:first-child .schoolFeature-box-title {
    color: #f6438a
}

.schoolFeature-box:nth-child(2) .schoolFeature-box-title {
    color: #4cbb8c
}

.schoolFeature-box:nth-child(3) .schoolFeature-box-title {
    color: #32d5b6
}

.schoolFeature-box:nth-child(4) .schoolFeature-box-title {
    color: #9a9eb6
}

.schoolFeature-box:nth-child(5) .schoolFeature-box-title {
    color: #f6438a
}

.schoolFeature-box:nth-child(6) .schoolFeature-box-title {
    color: #4cbb8c
}

.schoolFeature-box:nth-child(7) .schoolFeature-box-title {
    color: #32d5b6
}

.schoolFeature-box:first-child .schoolFeature-box-body:before {
    border-color: #f6438a;
    color: #f6438a
}

.schoolFeature-box:nth-child(2) .schoolFeature-box-body:before {
    border-color: #4cbb8c;
    color: #4cbb8c
}

.schoolFeature-box:nth-child(3) .schoolFeature-box-body:before {
    border-color: #32d5b6;
    color: #32d5b6
}

.schoolFeature-box:nth-child(4) .schoolFeature-box-body:before {
    border-color: #9a9eb6;
    color: #9a9eb6
}

.schoolFeature-box:nth-child(5) .schoolFeature-box-body:before {
    border-color: #f6438a;
    color: #f6438a
}

.schoolFeature-box:nth-child(6) .schoolFeature-box-body:before {
    border-color: #4cbb8c;
    color: #4cbb8c
}

.schoolFeature-box:nth-child(7) .schoolFeature-box-body:before {
    border-color: #32d5b6;
    color: #32d5b6
}

.schoolFeature-box-body:before {
    position: relative;
    z-index: 1;
    background: #fff;
    border: 1px solid;
    text-align: center;
    content: counter(feature-counter, decimal-leading-zero);
    counter-increment: feature-counter
}

.schoolFeature-box-img img {
    width: 100%
}

.schoolFeature-box .button {
    padding: .7em 0 .6em;
    max-width: 100%;
    width: 240px
}

@media (min-width:80.0625em) {
    .schoolFeature-box-body:before {
        margin-top: -60px;
        width: 90px;
        height: 90px;
        font-size: 54px;
        line-height: 90px
    }
}

@media (max-width:80em) {
    .schoolFeature-box-body:before {
        margin-top: -30px;
        width: 60px;
        height: 60px;
        font-size: 34px;
        line-height: 60px
    }
}

@media (min-width:68.8125em) {

    .schoolFeature-box:first-child,
    .schoolFeature-box:nth-child(2) {
        height: 670px
    }

    .schoolFeature-box:nth-child(3),
    .schoolFeature-box:nth-child(4) {
        height: 630px
    }

    .schoolFeature-box:nth-child(5),
    .schoolFeature-box:nth-child(6) {
        height: 675px
    }

    .schoolFeature-box:nth-child(7) {
        height: 730px
    }
}

@media (max-width:68.75em) {

    .schoolFeature-box:first-child,
    .schoolFeature-box:nth-child(2) {
        height: 690px
    }

    .schoolFeature-box:nth-child(3),
    .schoolFeature-box:nth-child(4) {
        height: 630px
    }

    .schoolFeature-box:nth-child(5),
    .schoolFeature-box:nth-child(6) {
        height: 700px
    }

    .schoolFeature-box:nth-child(7) {
        height: 750px
    }
}

@media (min-width:52.5625em) {
    .schoolFeature {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .schoolFeature-box {
        width: 46.72897%
    }

    .schoolFeature-box-img {
        padding-left: 46px
    }

    .schoolFeature-box-title {
        margin: 30px 0 20px
    }

    .schoolFeature-box .button {
        position: absolute;
        right: 0;
        bottom: 0
    }
}

@media (max-width:52.5em) {

    .schoolFeature-box:first-child,
    .schoolFeature-box:nth-child(2),
    .schoolFeature-box:nth-child(3),
    .schoolFeature-box:nth-child(4),
    .schoolFeature-box:nth-child(5),
    .schoolFeature-box:nth-child(6),
    .schoolFeature-box:nth-child(7) {
        height: auto
    }

    .schoolFeature-box-img {
        padding-left: 20px
    }

    .schoolFeature-box-title {
        margin: 20px 0 15px
    }
}

@media (min-width:30.0625em) {
    .schoolFeature {
        margin-bottom: -80px
    }

    .schoolFeature-box {
        margin-bottom: 80px
    }

    .schoolFeature-box-title {
        font-size: 20px
    }

    .schoolFeature-box .button {
        float: right;
        margin-top: 35px
    }
}

@media (max-width:30em) {
    .schoolFeature {
        margin-bottom: 0
    }

    .schoolFeature-box {
        margin-bottom: 60px
    }

    .schoolFeature-box-title {
        font-size: 1.2rem
    }

    .schoolFeature-box .button {
        margin-top: 25px
    }
}

.greetingLead-copy span {
    display: block;
    text-align: center
}

.greetingLead-copy .ja {
    font-weight: bold
}

.greetingLead-box {
    border: 1px solid #e7e8ee
}

.greetingLead-box-heading {
    font-size: 1rem;
    font-weight: bold;
    text-align: center;
    background: #e7e8ee;
    padding: .5em;
    letter-spacing: .1em
}

.greetingLead-box-heading span {
    display: inline-block;
    vertical-align: middle;
    padding-bottom: 2px
}

.greetingLead-box-body ul {
    width: 100%
}

.greetingLead-box-body li {
    font-weight: bold;
    text-align: center
}

.greetingLead-box-body li+li {
    margin-top: .5em
}

@media (min-width:48.0625em) {
    .greetingLead-boxGroup {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .greetingLead-box {
        width: 48%
    }

    .greetingLead-box-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        height: 200px
    }
}

@media (max-width:48em) {
    .greetingLead-box+.greetingLead-box {
        margin-top: 2em
    }

    .greetingLead-box-body {
        padding: 1.5em
    }
}

@media (min-width:40.0625em) {
    .greetingLead-copy {
        margin-bottom: 3em
    }

    .greetingLead-copy .en {
        font-size: 2.5rem
    }

    .greetingLead-copy .ja {
        font-size: 1.57rem
    }

    .greetingLead-box-heading span {
        font-size: 1.38rem
    }

    .greetingLead-box-body li {
        font-size: 1.38rem
    }
}

@media (max-width:40em) {
    .greetingLead-copy {
        margin-bottom: 1.8em
    }

    .greetingLead-copy .en {
        font-size: 2rem
    }

    .greetingLead-copy .ja {
        font-size: 1rem
    }
}

.greetingMaster-box-img {
    width: 210px
}

.greetingMaster-box-img img {
    width: 100%
}

.greetingMaster-box-heading {
    font-weight: bold;
    margin-bottom: 1em
}

.greetingMaster-name {
    margin-top: 1em
}

.greetingMaster-name span {
    display: block;
    line-height: 1
}

.greetingMaster-box-org {
    padding: 1.25em 2em;
    margin-top: 1.5em;
    background: #e7e8ee
}

@media (min-width:40.0625em) {
    .greetingMaster-box {
        display: table;
        width: 100%
    }

    .greetingMaster-box+.greetingMaster-box {
        margin-top: 100px
    }

    .greetingMaster-box-heading {
        font-size: 1.38rem
    }

    .greetingMaster-box-body,
    .greetingMaster-box-img {
        display: table-cell;
        vertical-align: top
    }

    .greetingMaster-box-body {
        padding-left: 40px
    }

    .greetingMaster-name {
        font-size: 16px
    }

    .greetingMaster-name span {
        font-size: 13px
    }
}

@media (max-width:40em) {
    .greetingMaster-box-heading {
        font-size: 1.15rem;
        margin-bottom: .8em
    }

    .greetingMaster-box+.greetingMaster-box {
        margin-top: 4em
    }

    .greetingMaster-box-img {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 2em
    }

    .greetingMaster-name {
        font-size: 14px
    }

    .greetingMaster-name span {
        font-size: 13px;
        line-height: 1.4
    }

    .greetingMaster-sign {
        width: 120px
    }
}

.groupSchool-logo {
    margin-bottom: 1em;
    width: 188px
}

.groupSchool-name {
    font-size: 1.2rem;
    font-weight: bold
}

.groupSchool-main {
    margin-bottom: 70px
}

.groupSchool-main-img img {
    width: 100%
}

.groupSchool-main-overview {
    padding: 1.25em 1.5em;
    margin-top: 1.5em;
    background: #e7e8ee
}

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

.groupSchool-sub:before {
    content: "";
    display: block;
    width: 23.5%;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

.groupSchool-sub-img {
    margin-bottom: .7em
}

.groupSchool-sub-img img {
    width: 100%
}

.groupSchool-sub:after {
    content: "";
    display: block;
    width: 23.5%
}

@media (min-width:68.8125em) {
    .groupSchool-main-img {
        width: 400px
    }

    .groupSchool-sub-box {
        width: 23.5%;
        margin-bottom: 70px
    }
}

@media (max-width:68.75em) {
    .groupSchool-main-img {
        width: 45%
    }

    .groupSchool-sub-box {
        width: 48.5%;
        margin-bottom: 40px
    }
}

@media (min-width:40.0625em) {
    .groupSchool-main {
        margin-bottom: 70px
    }

    .groupSchool-main-container {
        display: table;
        width: 100%
    }

    .groupSchool-main-body,
    .groupSchool-main-img {
        display: table-cell;
        vertical-align: top
    }

    .groupSchool-main-body {
        padding-left: 40px
    }

    .groupSchool-sub-body p {
        font-size: 12px
    }
}

@media (max-width:40em) {
    .groupSchool-main {
        margin-bottom: 40px
    }

    .groupSchool-main-img {
        width: 100%;
        margin-bottom: 1em
    }

    .groupSchool-sub-box {
        width: 100%
    }
}

.groupSchool-history figcaption,
.groupSchool-history figure img {
    display: block;
    text-align: center;
    margin-left: auto;
    margin-right: auto
}

.groupSchool-history figcaption {
    margin-top: 8px
}

@media (min-width:40.0625em) {
    .groupSchool-history table th {
        width: 170px;
        white-space: nowrap
    }

    .groupSchool-history .has-img .inner {
        display: table;
        width: 100%
    }

    .groupSchool-history .has-img .text,
    .groupSchool-history figure {
        display: table-cell;
        vertical-align: middle
    }

    .groupSchool-history .has-img .text {
        width: 70%
    }

    .groupSchool-history figure {
        width: 240px;
        margin-top: 5px;
        margin-left: auto
    }
}

@media (max-width:40em) {
    .groupSchool-history figure {
        display: none
    }
}

.animalSystem li {
    text-align: left
}

.animalSystem li+li {
    margin-top: 1em
}

.animalSystem li span {
    display: inline-block;
    font-weight: bold;
    margin-right: 1em
}

@media (min-width:68.8125em) {
    .animalSystem li span {
        text-align: right;
        width: 33%
    }
}

@media (max-width:68.75em) {
    .animalSystem li span {
        display: block
    }
}

@media (min-width:40.0625em) {
    .animalSystem {
        margin: 60px 0 70px
    }

    .animalSystem li span {
        font-size: 1.38rem
    }
}

@media (max-width:40em) {
    .animalSystem {
        margin: 15% 0
    }

    .animalSystem li span {
        font-size: 1.2rem
    }
}

.teacher-body .button {
    padding: 1em 0
}

@media (min-width:68.8125em) {
    .teacher {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .teacher-img {
        width: 40.186%
    }

    .teacher-body {
        width: 59.814%;
        padding-left: 40px;
        overflow: hidden
    }

    .teacher-body .button {
        width: 340px;
        margin-top: 3em;
        float: right
    }
}

@media (max-width:68.75em) {
    .teacher-img {
        margin-bottom: 1.5em
    }

    .teacher-img img {
        width: 100%
    }

    .teacher-body .button {
        width: 100%;
        margin-top: 2em
    }
}

.accessMain-body .button {
    margin-top: 2em
}

.accessMain-img a,
.accessSub-img a {
    position: relative;
    display: block
}

.accessMain-img a:before,
.accessSub-img a:before {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: #32d5b6;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1
}

.accessMain-img a:hover:before,
.accessSub-img a:hover:before {
    opacity: .4
}

.accessTime {
    margin-top: 1em
}

.accessTime li {
    position: relative;
    padding-left: 5.8em
}

.accessTime li+li {
    margin-top: .8em
}

.accessTime .station {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    color: #fff;
    background: #000;
    width: 5em;
    padding: 5px 0;
    margin-right: .5em
}

.accessTime .time {
    font-weight: bold
}

.accessTime .route {
    font-size: .9rem
}

@media (min-width:68.8125em) {

    .accessMain,
    .accessSub {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .accessMain-img {
        width: 58.878%
    }

    .accessMain-body {
        width: 41.122%;
        padding-left: 70px
    }

    .accessSub-img {
        width: 50.186%
    }

    .accessSub-body {
        width: 49.813%;
        padding-left: 40px
    }
}

@media (max-width:68.75em) {
    .accessMain {
        padding-top: 5%
    }

    .accessMain-img,
    .accessSub-img {
        margin-bottom: 1.5em
    }

    .accessMain-img img,
    .accessSub-img img {
        width: 100%
    }
}

@media print {

    .print .accessMain-body .button,
    .print .accessMain-img p,
    .print .accessSub-img .video-container,
    .print .accessSub-img p,
    .print .megaMenuBg,
    .print .megaMenuOverlay,
    .print .pageMenu,
    .print .pageTop,
    .print .railway,
    .print .section-copy,
    .print footer,
    .print header {
        display: none
    }

    .print .t-blank {
        padding-top: 2em
    }

    .print .b-blank {
        padding: 0
    }
}

.facilityMenu-box-link {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff
}

.facilityMenu-box.main .facilityMenu-box-link {
    background-image: url(../../assets/img/page/guide/facility/main/menu-main.jpg);
    background-position: center;
    background-repeat: repeat
}

.facilityMenu-box.other .facilityMenu-box-link {
    background-image: url(../../assets/img/page/guide/facility/main/menu-other.jpg);
    background-position: center;
    background-repeat: repeat
}

.facilityMenu-box-link:before {
    position: absolute;
    display: block;
    content: '';
    z-index: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
    -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
    transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1)
}

.facilityMenu-box-link>* {
    position: relative;
    z-index: 1
}

.facilityMenu-box-title {
    font-weight: bold;
    line-height: 1;
    text-align: center
}

.facilityMenu-box-title .icon {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.mainFacility-heading {
    line-height: 1;
    margin-bottom: 20px
}

.facilityGallery-item {
    display: none
}

.facilityGallery-item.current {
    display: none
}

.facilityGallery .slick-dots {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    bottom: auto
}

.facilityGallery .slick-dots li {
    display: block;
    height: auto;
    margin: 0 0 10px
}

.facilityGallery .caption {
    padding: .6em 1.5em;
    max-width: 760px;
    background: #000;
    color: #fff
}

@media (min-width:48.0625em) {
    .facilityMenu {
        margin-top: 70px
    }

    .facilityMenu-box-link {
        height: 220px
    }

    .facilityMenu-box-link:after {
        position: absolute;
        display: block;
        content: '';
        z-index: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 4px;
        background: #32d5b6;
        -webkit-transform: scalex(0);
        transform: scalex(0);
        -webkit-transform-origin: left;
        transform-origin: left;
        -webkit-transition: -webkit-transform 0.6s;
        transition: -webkit-transform 0.6s;
        transition: transform 0.6s;
        transition: transform 0.6s, -webkit-transform 0.6s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1)
    }

    .facilityMenu a:hover:after {
        -webkit-transform: scalex(1);
        transform: scalex(1)
    }

    .mainFacility-heading {
        font-size: 48px
    }

    .facilityMenu-box-title {
        font-size: 26px;
        -webkit-transition: opacity 0.4s;
        transition: opacity 0.4s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1)
    }

    section+section>.mainFacility {
        margin-top: 110px
    }
}

@media (max-width:48em) {
    .facilityMenu {
        margin-top: 30px
    }

    .facilityMenu-box-link {
        height: 180px
    }

    .mainFacility-heading {
        font-size: 32px
    }

    .facilityMenu-box-title {
        font-size: 16px
    }

    section+section>.mainFacility {
        margin-top: 60px
    }
}

@media (min-width:30.0625em) {
    .facilityMenu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .facilityMenu-box-title .icon {
        margin-top: 20px;
        font-size: 23px
    }

    .facilityMenu-box {
        width: 48.13084%
    }

    .mainFacility-head {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 30px
    }

    .mainFacility-head-img {
        width: 297px;
        margin-left: auto
    }

    .mainFacility-head-text {
        padding-right: 1em;
        max-width: 760px;
        width: 71.02804%
    }

    .facilityGallery .slick-list {
        max-width: 760px;
        width: 71.02804%
    }

    .facilityGallery .slick-dots {
        position: absolute;
        top: 0;
        right: 0;
        width: 27.1028%
    }

    .facilityGallery .slick-dots li {
        width: 48%
    }
}

@media (max-width:30em) {
    .facilityMenu-box {
        width: 100%
    }

    .facilityMenu-box+.facilityMenu-box {
        margin-top: 1em
    }

    .facilityMenu-box-title .icon {
        margin-top: 10px;
        font-size: 18px
    }

    .facilityMenu-box-link {
        height: 120px
    }

    .mainFacility-head {
        margin-bottom: 20px
    }

    .mainFacility-head-text {
        margin-bottom: 20px
    }

    .mainFacility-head-img {
        margin-right: auto;
        text-align: center
    }

    .mainFacility-head-img img {
        width: 90%
    }

    .facilityGallery .slick-dots {
        position: static;
        width: 100%;
        margin-top: 15px
    }

    .facilityGallery .slick-dots li {
        width: 32%
    }

    .facilityGallery .slick-dots:after {
        content: '';
        display: block;
        width: 32%
    }
}

@media (min-width:30.0625em) {
    .spendSimulation .extraBox-body {
        padding: 2em 31.25px
    }
}

.dormitoryFacility {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: -15px
}

.dormitoryFacility li {
    margin-bottom: 15px
}

.dormitoryFacility li+li {
    margin-top: 0
}

.dormitoryFacility .iconBox {
    position: relative;
    display: block;
    padding-top: 100%;
    background: #9a9eb6;
    border-radius: 5px;
    text-align: center
}

.dormitoryFacility .icon {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    z-index: 1;
    color: #fff
}

.dormitoryFacility .name {
    display: block;
    margin-top: 10px;
    line-height: 1.4;
    text-align: center
}

@media (min-width:68.8125em) {
    .dormitoryFacility li {
        width: 18%
    }

    .dormitoryFacility .icon {
        font-size: 45px
    }
}

@media (max-width:68.75em) {
    .dormitoryFacility li {
        width: 22%
    }

    .dormitoryFacility .icon {
        font-size: 32px
    }
}

@media (max-width:52.5em) {
    .dormitoryFacility li {
        width: 30%
    }
}

@media (max-width:48em) {
    .dormitoryFacility li {
        width: 18%
    }

    .dormitoryFacility .icon {
        font-size: 7vw
    }
}

@media (min-width:30.0625em) {
    .dormitoryFacility .name {
        font-size: 12px
    }
}

@media (max-width:30em) {
    .dormitoryFacility li {
        width: 22%
    }

    .dormitoryFacility .name {
        font-size: 10px
    }
}

@media (max-width:20em) {
    .dormitoryFacility li {
        width: 30%
    }
}

.courseLead-box {
    position: relative;
    border: 1px solid
}

.courseLead.biyou .courseLead-box {
    border-color: #f6438a
}

.courseLead.kango .courseLead-box {
    border-color: #4cbb8c
}

.courseLead.kyosei .courseLead-box {
    border-color: #32d5b6
}

.courseLead-box-heading {
    color: #fff;
    font-weight: bold
}

.courseLead.biyou .courseLead-box-heading {
    background: #f6438a
}

.courseLead.kango .courseLead-box-heading {
    background: #4cbb8c
}

.courseLead.kyosei .courseLead-box-heading {
    background: #32d5b6
}

.courseLead-box-body {
    padding: 1.5em 1.5em 3em
}

.courseLead-box .button {
    position: absolute;
    bottom: -24px;
    width: 190px
}

.courseLead-box .button .icon {
    margin-left: .5em
}

@media (min-width:80.0625em) {
    .courseLead-box-heading {
        font-size: 22px
    }
}

@media (max-width:80em) {
    .courseLead-box-heading {
        font-size: 1.3rem
    }
}

@media (min-width:52.5625em) {
    .courseLead {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .courseLead-box {
        width: 48.41121%
    }
}

@media (max-width:52.5em) {
    .courseLead-box {
        margin-bottom: 60px
    }
}

@media (min-width:48.0625em) {
    .courseLead-box-heading {
        padding: .5em 1em
    }

    .courseLead-box-heading .icon {
        width: 30px;
        height: 30px;
        margin-top: -6px;
        margin-right: .5em;
        font-size: 30px
    }

    .courseLead-box-img {
        position: relative;
        overflow: hidden
    }

    .courseLead-box-img:before {
        display: block;
        position: absolute;
        display: block;
        content: '';
        z-index: 1;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        -webkit-transition: opacity 0.6s;
        transition: opacity 0.6s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1)
    }

    .courseLead.biyou .courseLead-box-img:before {
        background: rgba(246, 67, 138, 0.4)
    }

    .courseLead.kango .courseLead-box-img:before {
        background: rgba(56, 115, 237, 0.4)
    }

    .courseLead.kyosei .courseLead-box-img:before {
        background: rgba(50, 213, 182, 0.4)
    }

    .courseLead-box-link:hover .courseLead-box-img:before {
        opacity: 1
    }

    .courseLead-box-img img {
        width: 100%;
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: -webkit-transform 1s;
        transition: -webkit-transform 1s;
        transition: transform 1s;
        transition: transform 1s, -webkit-transform 1s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .courseLead-box-link:hover .courseLead-box-img img {
        -webkit-transform: scale(1.08);
        transform: scale(1.08)
    }

    .courseLead-box .button {
        right: 20px
    }
}

@media (max-width:48em) {
    .courseLead-box-heading {
        padding: .5em
    }

    .courseLead-box-heading .icon {
        width: 25px;
        height: 25px;
        margin-top: -6px;
        margin-right: .5em;
        font-size: 25px
    }

    .courseLead-box .button {
        right: 0;
        left: 0;
        bottom: -17px;
        width: 70%;
        margin-left: auto;
        margin-right: auto
    }
}

.coursePoint {
    margin-top: 40px;
    counter-reset: feature-counter
}

.coursePoint-box {
    display: table;
    width: 100%
}

.coursePoint-box+.coursePoint-box {
    margin-top: 40px
}

.coursePoint-box-body,
.coursePoint-box-img {
    display: table-cell;
    vertical-align: top
}

.coursePoint-box-img {
    position: relative
}

.coursePoint-box-img:before {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    background: #fff;
    border: 1px solid;
    text-align: center;
    content: counter(feature-counter, decimal-leading-zero);
    counter-increment: feature-counter
}

.coursePoint.biyou .coursePoint-box-img:before {
    color: #f6438a
}

.coursePoint.kango .coursePoint-box-img:before {
    color: #4cbb8c
}

.coursePoint.kyosei .coursePoint-box-img:before {
    color: #2dc4a9
}

.coursePoint-box-heading {
    margin-bottom: 10px
}

.coursePoint.biyou .coursePoint-box-heading {
    color: #f6438a
}

.coursePoint.kango .coursePoint-box-heading {
    color: #4cbb8c
}

.coursePoint.kyosei .coursePoint-box-heading {
    color: #2dc4a9
}

@media (min-width:68.8125em) {
    .coursePoint-box-img {
        width: 370px
    }

    .coursePoint-box-img:before {
        width: 90px;
        height: 90px;
        font-size: 43px;
        line-height: 90px
    }
}

@media (max-width:68.75em) {
    .coursePoint-box-img {
        width: 40%
    }

    .coursePoint-box-img:before {
        width: 60px;
        height: 60px;
        font-size: 28px;
        line-height: 60px
    }
}

@media (min-width:48.0625em) {
    .coursePoint-box-img {
        padding: 22px 22px 0 0
    }

    .coursePoint-box-body {
        padding-left: 40px
    }

    .coursePoint-box-heading {
        font-size: 22px
    }
}

@media (max-width:48em) {

    .coursePoint-box,
    .coursePoint-box-body,
    .coursePoint-box-img {
        display: block
    }

    .coursePoint-box-img {
        width: 100%
    }

    .coursePoint-box-img:before {
        top: auto;
        left: 0;
        bottom: -30px
    }

    .coursePoint-box-body {
        padding-top: 50px
    }

    .coursePoint-box-heading {
        font-size: 1.4rem
    }
}

@media (max-width:30em) {
    .coursePoint-box-heading {
        font-size: 1.2rem
    }

    .coursePoint-box-img:before {
        width: 50px;
        height: 50px;
        font-size: 25px;
        line-height: 50px
    }
}

.curriculumList td ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media (min-width:68.8125em) {
    .curriculumList td ul:after {
        content: '';
        width: 33%
    }

    .curriculumList td ul li {
        width: 33%
    }
}

@media (max-width:68.75em) {
    .curriculumList td ul li {
        width: 45%
    }
}

@media (min-width:48.0625em) {
    .curriculumList th {
        width: 140px
    }
}

@media (max-width:30em) {
    .curriculumList td ul li {
        width: 100%
    }
}

.quaList td ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media (min-width:68.8125em) {
    .quaList td ul:after {
        content: '';
        width: 33%
    }

    .quaList td ul li {
        width: 33%
    }
}

@media (max-width:68.75em) {
    .quaList td ul li {
        width: 45%
    }
}

@media (min-width:48.0625em) {
    .quaList th {
        width: 100px
    }
}

@media (max-width:30em) {
    .quaList td ul li {
        width: 100%
    }
}

.timeTable {
    margin-top: .7em;
    table-layout: fixed;
    text-align: center
}

.timeTable td,
.timeTable th {
    padding: 1em
}

.timeTable th {
    width: auto
}

.timeTable tr th:first-child {
    width: 227px
}

.timeTable tbody tr td:first-child {
    position: relative;
    padding-left: 80px
}

.timeTable thead tr th:first-child {
    border-right: 1px solid #fff;
    border-left: 1px solid #afb3c7
}

.timeTable thead tr th:nth-child(2),
.timeTable thead tr th:nth-child(3),
.timeTable thead tr th:nth-child(4),
.timeTable thead tr th:nth-child(5) {
    border-right: 1px solid #fff;
    border-left: 1px solid #fff
}

.timeTable thead tr th {
    border-top: 1px solid #afb3c7;
    border-right: 1px solid #afb3c7;
    border-bottom: 1px solid #afb3c7;
    color: #fff;
    font-weight: bold
}

.timeTable tbody tr td {
    border: 1px solid #afb3c7
}

.timeTable .period {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 60px;
    height: 100%;
    background: #c3c6d5;
    color: #fff;
    font-weight: bold;
    text-align: center
}

.courseDetail-box-year-inner {
    color: #fff;
    font-weight: normal;
    text-align: center;
    letter-spacing: 0;
    white-space: nowrap
}

.courseDetail.biyou .courseDetail-box-year-inner {
    background: #f6438a
}

.courseDetail.kango .courseDetail-box-year-inner {
    background: #4cbb8c
}

.courseDetail.kyosei .courseDetail-box-year-inner {
    background: #32d5b6
}

.courseDetail-box-heading {
    font-weight: bold
}

@media (min-width:48.0625em) {
    .courseDetail-box+.courseDetail-box {
        margin-top: 130px
    }

    .courseDetail-box-head {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-bottom: 40px
    }

    .courseDetail-box-heading {
        padding-left: 40px;
        font-size: 18px
    }

    .courseDetail-box-year-inner {
        padding: 0 15px;
        font-size: 24px;
        height: 100px;
        line-height: 100px
    }

    .courseDetail-box-year-inner span {
        font-size: 40px
    }
}

@media (max-width:48em) {
    .courseDetail-box+.courseDetail-box {
        margin-top: 50px
    }

    .courseDetail-box-head {
        margin-bottom: 20px
    }

    .courseDetail-box-heading {
        font-size: 16px
    }

    .courseDetail-box-year-inner {
        margin-bottom: 15px;
        width: 7em;
        font-size: 14px
    }

    .courseDetail-box-year-inner span {
        font-size: 20px
    }
}

.trainingDetail-box-img {
    margin-bottom: 1.5em;
    width: 100%
}

.trainingDetail+.button {
    max-width: 517px
}

@media (min-width:40.0625em) {
    .trainingDetail {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .trainingDetail-box {
        width: 48.13084%
    }
}

@media (min-width:30.0625em) {
    *+.trainingDetail {
        margin-top: 70px
    }

    .trainingDetail-box {
        margin-bottom: 80px
    }
}

@media (max-width:30em) {
    *+.trainingDetail {
        margin-top: 30px
    }

    .trainingDetail-box {
        margin-bottom: 60px
    }
}

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

.courseIntro-box-heading {
    padding: .5em 1em;
    margin-bottom: 1em;
    background: #e7e8ee;
    font-weight: bold;
    text-align: center
}

.courseIntro-box-heading .icon {
    font-size: 1.5rem;
    margin-right: .25em;
    vertical-align: -15%
}

@media (min-width:68.8125em) {
    .courseIntro {
        margin-top: 60px
    }

    .courseIntro-box {
        width: 18.50467%
    }
}

@media (max-width:68.75em) {
    .courseIntro {
        margin-top: 40px;
        margin-bottom: -40px
    }

    .courseIntro:after {
        content: '';
        width: 31%
    }

    .courseIntro-box {
        width: 31%;
        margin-bottom: 40px
    }
}

@media (max-width:30em) {
    .courseIntro {
        margin-top: 30px;
        margin-bottom: -30px
    }

    .courseIntro:after {
        content: '';
        width: 48.5%
    }

    .courseIntro-box {
        width: 48.5%;
        margin-bottom: 30px
    }
}

.courseList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 60px
}

.courseList-box-link {
    display: block
}

.courseList-box-heading {
    padding: 20px 0;
    color: #fff;
    font-weight: bold;
    text-align: center
}

.courseList-box.biyou .courseList-box-heading {
    background: #f6438a
}

.courseList-box.kango .courseList-box-heading {
    background: #4cbb8c
}

.courseList-box.kyosei .courseList-box-heading {
    background: #32d5b6
}

.aside .courseList-box-heading {
    padding: 17px 0
}

.courseList-box-heading span {
    display: block;
    font-size: 22px;
    line-height: 1.6
}

.aside .courseList-box-heading span {
    font-size: 18px
}

.courseList-box-heading .icon {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
    width: 45px;
    height: 45px;
    font-size: 45px;
    line-height: 1
}

.courseList-box-img {
    position: relative;
    overflow: hidden
}

.courseList-box-img img {
    width: 100%
}

.courseList-box-catch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 130px;
    font-size: 18px;
    font-weight: bold;
    text-align: center
}

.courseList-box.biyou .courseList-box-catch {
    color: #f6438a
}

.courseList-box.kango .courseList-box-catch {
    color: #4cbb8c
}

.courseList-box.kyosei .courseList-box-catch {
    color: #32d5b6
}

.aside .courseList-box-catch {
    font-size: 16px
}

.courseList-box-job dt {
    padding-bottom: 10px;
    margin-bottom: 10px;
    border: 1px solid;
    border-width: 0 0 1px
}

.courseList-box.biyou .courseList-box-job dt {
    border-color: #f6438a
}

.courseList-box.kango .courseList-box-job dt {
    border-color: #4cbb8c
}

.courseList-box.kyosei .courseList-box-job dt {
    border-color: #32d5b6
}

.courseList-box .button {
    position: relative;
    z-index: 1;
    padding: 14px 18px;
    margin: -20px auto 0;
    width: 240px;
    font-size: 1.1rem;
    line-height: 1
}

.courseList-box .button .icon {
    margin-left: .5em
}

@media (min-width:88.1875em) {
    .courseList {
        margin-top: 60px
    }

    .courseList-box {
        padding: 1px;
        width: 32.05607%
    }

    .courseList-box.biyou {
        background: #f6438a
    }

    .courseList-box.kango {
        background: #4cbb8c
    }

    .courseList-box.kyosei {
        background: #32d5b6
    }

    .courseList-box-img .landscape {
        display: none
    }

    .aside .courseList-box-img .landscape {
        display: block
    }

    .courseList-box-job {
        padding: 30px 17px;
        background: #e7e8ee
    }

    .courseList-box .button {
        display: none
    }
}

@media (max-width:88.125em) {
    .courseList {
        margin-bottom: -60px
    }

    .courseList-box {
        width: 48.5%;
        margin-bottom: 60px
    }

    .courseList-box-body {
        position: relative;
        z-index: 1;
        width: 90%;
        padding: 2rem 2em 3em;
        margin: -20px auto 0;
        background: #fff;
        border: 1px solid;
        border-width: 1px
    }

    .courseList-box.biyou .courseList-box-body {
        border-color: #f6438a
    }

    .courseList-box.kango .courseList-box-body {
        border-color: #4cbb8c
    }

    .courseList-box.kyosei .courseList-box-body {
        border-color: #32d5b6
    }

    .aside .courseList-box-body {
        padding: 2rem 2em 2.8em
    }

    .courseList-box-heading .icon {
        width: 35px;
        height: 35px;
        font-size: 35px
    }

    .courseList-box-heading span br {
        display: inline-block;
        margin-left: .5em
    }

    .courseList-box-catch {
        display: block;
        height: auto;
        padding: 0;
        margin-bottom: .8em;
        text-align: left
    }

    .aside .courseList-box-catch {
        margin-bottom: 0
    }

    .courseList-box-catch br {
        display: none
    }

    .courseList-box-img .portrait {
        display: none
    }
}

@media (max-width:68.75em) {
    .courseList-box-heading span {
        font-size: 18px;
        line-height: 1.5
    }
}

@media (min-width:48.0625em) {
    .aside .courseList-box-heading {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        text-align: left
    }

    .aside .courseList-box-heading .icon {
        margin: 0 15px 0 0
    }

    .courseList-box-catch {
        background: #fff
    }

    .courseList-box-img:before {
        display: block;
        position: absolute;
        display: block;
        content: '';
        z-index: 1;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        -webkit-transition: opacity 0.6s;
        transition: opacity 0.6s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1)
    }

    .courseList-box.biyou .courseList-box-img:before {
        background-color: rgba(246, 67, 138, 0.4)
    }

    .courseList-box.kango .courseList-box-img:before {
        background-color: rgba(56, 115, 237, 0.4)
    }

    .courseList-box.kyosei .courseList-box-img:before {
        background-color: rgba(50, 213, 182, 0.4)
    }

    .courseList-box-link:hover .courseList-box-img:before {
        opacity: 1
    }

    .courseList-box-img img {
        width: 100%;
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: -webkit-transform 1s;
        transition: -webkit-transform 1s;
        transition: transform 1s;
        transition: transform 1s, -webkit-transform 1s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .courseList-box-link:hover .courseList-box-img img {
        -webkit-transform: scale(1.08);
        transform: scale(1.08)
    }
}

@media (max-width:48em) {
    .courseList-box {
        width: 100%
    }

    .courseList-box-heading {
        padding: 20px 0
    }

    .aside .courseList-box-heading .icon {
        width: 35px;
        height: 35px;
        font-size: 35px;
        margin-bottom: 10px
    }

    .courseList-box-body {
        padding-top: 3em;
        padding-bottom: 4em;
        background: none
    }

    .aside .courseList-box-body {
        padding: 3rem 2em 3em
    }

    .courseList-box-catch {
        font-size: 16px;
        background: none
    }

    .courseList-box .button {
        width: 70%
    }
}

.chuoFeature {
    position: relative;
    border: 1px solid #9a9eb6
}

.chuoFeature-bg {
    background-repeat: no-repeat;
    background-size: cover
}

.chuoFeature-body {
    position: relative;
    z-index: 1
}

.chuoFeature-body .list {
    margin-top: 30px
}

.chuoFeature-heading {
    max-width: 500px;
    font-weight: bold;
    margin-bottom: 1rem;
    border-bottom: 1px solid #9a9eb6
}

@media (min-width:88.1875em) {
    .chuoFeature-bg {
        width: 663px
    }
}

@media (max-width:88.125em) {
    .chuoFeature-bg {
        width: 70%
    }
}

@media (min-width:48.0625em) {
    .chuoFeature {
        padding: 40px;
        margin-top: 70px
    }

    .chuoFeature-bg {
        position: absolute;
        top: 0;
        right: 0;
        max-width: 100%;
        height: 100%;
        background-image: url(../../assets/img/page/course/index/feature.jpg);
        background-position: 0
    }

    .chuoFeature-heading {
        font-size: 20px
    }
}

@media (max-width:48em) {
    .chuoFeature {
        padding: 0;
        margin-top: 40px
    }

    .chuoFeature-bg {
        width: 100%;
        max-width: 100%;
        padding-top: 67.1875%;
        background-image: url(../../assets/img/page/course/index/feature-sp.jpg);
        background-position: center
    }

    .chuoFeature-heading {
        font-size: 18px
    }

    .chuoFeature-body {
        padding: 30px 20px
    }
}

.quaTable {
    table-layout: fixed;
    width: 100%;
    font-size: 13px
}

.quaTable td,
.quaTable th {
    width: auto;
    padding: 1.2em 1em;
    letter-spacing: .05em;
    text-align: center
}

.quaTable tr td:first-child,
.quaTable tr th:first-child {
    text-align: left
}

@media (min-width:48.0625em) {

    .quaTable tr td:first-child,
    .quaTable tr th:first-child {
        width: 250px
    }
}

@media (max-width:48em) {
    .quaTableWrapper {
        overflow: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch
    }

    .quaTableWrapper::-webkit-scrollbar {
        height: 5px
    }

    .quaTableWrapper::-webkit-scrollbar-track {
        background: #F1F1F1
    }

    .quaTableWrapper::-webkit-scrollbar-thumb {
        background: #BCBCBC
    }

    .quaTable {
        width: 690px
    }

    .quaTable tr td:first-child,
    .quaTable tr th:first-child {
        width: 160px
    }
}

.eventTime {
    margin-bottom: 40px
}

.eventTime span {
    font-size: 1.54rem;
    font-weight: bold;
    padding-right: .5em
}

.eventSchedule {
    margin-top: 1.5em
}

.eventSchedule:first-of-type {
    margin-bottom: 2em
}

.eventSchedule .item {
    position: relative;
    float: left;
    border: 1px solid #9a9eb6;
    padding: 8px 0;
    margin-bottom: 30px;
    text-align: center;
    white-space: nowrap
}

.eventSchedule .item:after,
.eventSchedule .item:before {
    position: absolute;
    display: block;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.eventSchedule .heading {
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 70%;
    z-index: 3;
    padding: .4em 0;
    font-weight: bold;
    text-align: center;
    line-height: 1
}

.eventSchedule .new-grade,
.eventSchedule .special {
    background: #e7e8ee
}

.eventSchedule .special .heading {
    color: #fff;
    background: #000;
    text-transform: uppercase
}

.eventSchedule .new-grade .heading {
    background: #b0b4c8
}

.eventSchedule .is-end {
    border-color: #e7e8ee
}

.eventSchedule .is-end:before {
    z-index: 3;
    background: rgba(255, 255, 255, 0.8)
}

.eventSchedule .is-end:after {
    top: 50%;
    left: auto;
    content: '終了';
    font-weight: bold;
    color: #FF3300;
    border: 1px solid #FF3300;
    border-radius: 50%;
    z-index: 4;
    background: transparent;
    -webkit-transform: translateY(-50%) rotate(18deg);
    transform: translateY(-50%) rotate(18deg)
}

.eventSchedule .new-grade.is-end .heading,
.eventSchedule .special.is-end .heading {
    color: #fff;
    background: #a1a1a1
}

.eventSchedule .date {
    position: relative;
    z-index: 1
}

.eventSchedule .day,
.eventSchedule .month {
    font-weight: 400;
    color: #333
}

.eventSchedule .day-of-the-week.saturday {
    color: #4cbb8c
}

.eventSchedule .day-of-the-week.sunday {
    color: #f6438a
}

@media (min-width:68.8125em) {
    .eventSchedule {
        margin-right: -2%
    }

    .eventSchedule .item {
        width: 18%;
        margin-right: 2%
    }
}

@media (max-width:68.75em) {
    .eventSchedule {
        margin-right: -3.3%
    }

    .eventSchedule .item {
        width: 30%;
        margin-right: 3.3%
    }
}

@media (max-width:48em) {
    .eventTime {
        margin-bottom: 2em
    }

    .eventSchedule:first-of-type {
        margin-bottom: 1em
    }
}

@media (min-width:40.0625em) {

    .eventSchedule .day,
    .eventSchedule .month {
        font-size: 2rem
    }

    .eventSchedule .day .label,
    .eventSchedule .month .label {
        font-size: 1rem
    }

    .eventSchedule .is-end:after {
        right: 9px;
        width: 54px;
        height: 54px;
        line-height: 54px
    }
}

@media (max-width:40em) {
    .eventSchedule {
        margin-right: 0
    }

    .eventSchedule .item {
        width: 48.5%;
        margin-right: 0;
        margin-bottom: 1.7em
    }

    .eventSchedule .item {
        padding: 1em 0
    }

    .eventSchedule .item:nth-of-type(2n) {
        float: right
    }

    .eventSchedule .heading {
        top: -14px
    }

    .eventSchedule .heading span {
        font-size: .9em
    }

    .eventSchedule .day,
    .eventSchedule .month {
        font-size: 1.7rem
    }

    .eventSchedule .day .label,
    .eventSchedule .month .label {
        font-size: 1.2rem
    }

    .eventSchedule .is-end:after {
        right: 0;
        left: 0;
        margin-left: auto;
        margin-right: auto;
        width: 40px;
        height: 40px;
        line-height: 40px
    }
}

.eventPoint-heading {
    line-height: 1;
    text-align: center;
    margin-bottom: 1em
}

.eventPoint-heading .en {
    display: block;
    font-size: 3.07rem;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0
}

.eventPoint-heading .ja {
    position: relative;
    display: inline-block;
    font-size: 1rem;
    font-weight: bold;
    letter-spacing: .25em;
    text-indent: .25em;
    vertical-align: middle;
    margin-bottom: 14px
}

.eventPoint-heading .ja:after {
    position: absolute;
    display: block;
    content: '';
    width: 100%;
    height: 2px;
    left: 0;
    right: 0;
    bottom: -10px;
    margin: 0 auto
}

.eventPoint-heading.has-border-blue .ja:after {
    background: #4cbb8c
}

.eventPoint-heading.has-border-pink .ja:after {
    background: #f6438a
}

.eventPoint-heading.has-border-green .ja:after {
    background: #32d5b6
}

@media (min-width:40.0625em) {
    .eventPoint-heading .en {
        font-size: 3.07rem
    }
}

@media (max-width:40em) {
    .eventPoint-heading .en {
        font-size: 2.5rem
    }

    .eventPoint-heading .ja {
        margin-bottom: 18px
    }
}

.eventPoint-box+.eventPoint-box {
    margin-top: 40px
}

.eventPoint-box-heading {
    font-weight: bold;
    margin-bottom: .8em
}

.eventPoint-box-heading .icon {
    margin: -2px .5em 0 0
}

.eventPoint-box-img img {
    width: 100%
}

@media (min-width:68.8125em) {
    .eventPoint-box-body {
        padding-right: 2.5em
    }

    .eventPoint-box-img {
        width: 320px
    }
}

@media (max-width:68.75em) {
    .eventPoint-box-body {
        padding-right: 2.5em
    }

    .eventPoint-box-img {
        width: 40%
    }
}

@media (min-width:40.0625em) {
    .eventPoint-box-heading {
        font-size: 1.38rem
    }

    .eventPoint-box {
        display: table;
        width: 100%
    }

    .eventPoint-box-body,
    .eventPoint-box-img {
        display: table-cell;
        vertical-align: top
    }
}

@media (max-width:40em) {
    .eventPoint-box-heading {
        font-size: 1.1rem
    }

    .eventPoint-box-body {
        padding-right: 0
    }

    .eventPoint-box-img {
        width: 100%;
        margin-top: 1em
    }
}

.certificate {
    position: relative
}

.certificate img {
    position: absolute;
    bottom: 0;
    right: 30px
}

@media (min-width:68.8125em) {
    .certificate {
        padding-right: 250px
    }
}

@media (max-width:68.75em) {
    .certificate img {
        display: none
    }
}

.participantsCommment li {
    position: relative;
    padding-left: 2.2em
}

.participantsCommment li+li {
    margin-top: 1.5em
}

.participantsCommment li .icon {
    position: absolute;
    top: .2em;
    left: 0;
    font-size: 145%
}

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

.relatedEvent-box {
    position: relative
}

.relatedEvent-img {
    width: 100%
}

.relatedEvent-head {
    position: relative;
    overflow: hidden
}

.relatedEvent-name {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin: 0 auto;
    text-shadow: 0 0 8px #000;
    color: #fff;
    text-align: center
}

.relatedEvent-body time {
    font-size: 15px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0;
    margin-bottom: 5px
}

.relatedEvent-body time .icon {
    margin: -4px .5em 0 0
}

.relatedEventWrapper.is-gakusetsu .relatedEvent-box.gakusetsu,
.relatedEventWrapper.is-guidance .relatedEvent-box.guidance,
.relatedEventWrapper.is-other .relatedEvent-box.other,
.relatedEventWrapper.is-taiken .relatedEvent-box.taiken {
    display: none
}

@media (min-width:88.1875em) {
    .relatedEvent-name {
        font-size: 26px
    }
}

@media (max-width:88.125em) {
    .relatedEvent-name {
        font-size: 20px
    }
}

@media (min-width:52.5625em) {
    .relatedEvent-box {
        width: 31.5%;
        padding-top: 16px
    }

    .relatedEvent-body {
        padding-top: .7em
    }
}

@media (max-width:52.5em) {
    .relatedEvent-box {
        width: 48.5%;
        margin-bottom: 30px
    }

    .relatedEvent-body {
        padding-top: 1em
    }
}

@media (min-width:48.0625em) {
    .relatedEvent-img {
        -webkit-transition: -webkit-transform 1.5s;
        transition: -webkit-transform 1.5s;
        transition: transform 1.5s;
        transition: transform 1.5s, -webkit-transform 1.5s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .relatedEvent-link:hover .relatedEvent-img {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }
}

@media (max-width:40em) {
    .relatedEvent-name {
        font-size: 16px
    }
}

@media (max-width:20em) {
    .relatedEvent-box {
        width: 100%
    }
}

@media (min-width:48.0625em) {
    .eventEntry.taiken .button:before {
        background: #4cbb8c
    }

    .eventEntry.taiken .button:hover {
        border-color: #4cbb8c
    }

    .eventEntry.gakusetsu .button:before {
        background: #f6438a
    }

    .eventEntry.gakusetsu .button:hover {
        border-color: #f6438a
    }

    .eventEntry.guidance .button:before {
        background: #32d5b6
    }

    .eventEntry.guidance .button:hover {
        border-color: #32d5b6
    }
}

@media (min-width:40.0625em) {

    *+.eventEntry,
    .eventEntry+* {
        margin-top: 60px
    }
}

@media (max-width:40em) {

    *+.eventEntry,
    .eventEntry+* {
        margin-top: 2rem
    }
}

.eventOther-box:last-child {
    padding-top: 40px;
    border-top: 1px dashed #ddd
}

.eventOther-box-heading {
    font-size: 1.4rem;
    margin-bottom: 10px
}

.eventOther-box-heading .icon {
    margin: -2px .4em 0 0
}

.eventOther-img {
    display: block;
    margin-bottom: 30px
}

.eventOther-box .eventSchedule .item {
    width: 196px
}

.eventOther-box .eventSchedule .item:nth-child(2n) {
    margin-right: 0;
    margin-left: auto
}

@media (min-width:40.0625em) {
    .eventOther {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin-top: 70px;
        margin-bottom: -60px
    }

    .eventOther-box {
        width: 48.5%;
        margin-bottom: 60px
    }

    .eventOther-box .anchor {
        margin-top: -150px;
        padding-top: 150px
    }
}

@media (max-width:40em) {
    .eventOther {
        margin-top: 40px
    }

    .eventOther-box {
        margin-bottom: 40px
    }

    .eventOther-box+.eventOther-box {
        padding-top: 40px;
        border-top: 1px dashed #ddd
    }

    .eventOther-box .anchor {
        margin-top: -80px;
        padding-top: 80px
    }

    .eventOther-box .eventSchedule .item {
        width: 100%
    }
}

.eventIntro-box+.eventIntro-box {
    margin-top: 40px
}

.eventIntro-box.taiken {
    background-color: #4cbb8c
}

.eventIntro-box.gakusetsu {
    background-color: #f6438a
}

.eventIntro-box.guidance {
    background-color: #32d5b6
}

.eventIntro-box.other {
    background-color: #9a9eb6
}

.eventIntro-box-link {
    width: 100%;
    color: #fff;
    overflow: hidden
}

.eventIntro-box-img {
    height: 160px
}

.eventIntro-box.taiken .eventIntro-box-img {
    background: url(../../assets/img/page/event/index/taiken.jpg) 100%;
    background-size: cover
}

.eventIntro-box.gakusetsu .eventIntro-box-img {
    background: url(../../assets/img/page/event/index/gakusetsu.jpg);
    background-size: cover
}

.eventIntro-box.guidance .eventIntro-box-img {
    background: url(../../assets/img/page/event/index/guidance.jpg) 100%;
    background-size: cover
}

.eventIntro-box.other .eventIntro-box-img {
    background: url(../../assets/img/page/event/index/other.jpg);
    background-size: cover
}

.eventIntro-box-heading {
    margin-bottom: 5px
}

.eventIntro-box-heading .icon {
    font-size: 14px;
    margin: -2px 0 0 .5em
}

.eventIntro-box-body {
    padding: 0 20px
}

@media (min-width:80.0625em) {
    .eventIntro-box-img {
        width: 50%
    }

    .eventIntro-box-heading {
        font-size: 27px
    }
}

@media (max-width:80em) {
    .eventIntro-box-img {
        width: 45%
    }

    .eventIntro-box-heading {
        font-size: 24px
    }
}

@media (max-width:52.5em) {
    .eventIntro-box-heading {
        font-size: 20px
    }
}

@media (min-width:48.0625em) {
    *+.eventIntro {
        margin-top: 70px
    }

    .eventIntro-box-link {
        position: relative
    }

    .eventIntro-box-link:before {
        position: absolute;
        display: block;
        content: '';
        z-index: 1;
        top: 0;
        left: 0;
        width: 50%;
        height: 100%;
        opacity: 0;
        -webkit-transition: opacity 0.6s;
        transition: opacity 0.6s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1)
    }

    .eventIntro-box.taiken .eventIntro-box-link:before {
        background-color: rgba(56, 115, 237, 0.4)
    }

    .eventIntro-box.gakusetsu .eventIntro-box-link:before {
        background-color: rgba(246, 67, 138, 0.4)
    }

    .eventIntro-box.guidance .eventIntro-box-link:before {
        background-color: rgba(50, 213, 182, 0.4)
    }

    .eventIntro-box.other .eventIntro-box-link:before {
        background-color: rgba(154, 158, 182, 0.4)
    }

    .eventIntro-box-link:hover:before {
        opacity: 1
    }
}

@media (max-width:48em) {
    *+.eventIntro {
        margin-top: 40px
    }
}

@media (min-width:40.0625em) {
    .eventIntro-box-link {
        display: table;
        width: 100%;
        color: #fff;
        overflow: hidden
    }

    .eventIntro-box-body,
    .eventIntro-box-img {
        display: table-cell;
        vertical-align: middle
    }
}

@media (max-width:40em) {
    .eventIntro-box-link {
        display: block
    }

    .eventIntro-box-img {
        width: 100%
    }

    .eventIntro-box-heading {
        font-size: 18px
    }

    .eventIntro-box-body {
        padding: 1.5em
    }
}

.eventCalendar {
    border-bottom: 0
}

.eventCalendar .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #e7e8ee
}

.eventCalendar .box+.box {
    border-top: 1px solid #9a9eb6
}

.eventCalendar .month {
    border-left: 0;
    border-right: 0;
    font-size: 24px;
    font-weight: 300;
    text-align: center;
    white-space: nowrap
}

.eventCalendar .month span {
    font-size: 35px
}

.eventCalendar .body {
    overflow: hidden;
    background: #fff
}

.eventCalendar .item {
    position: relative;
    float: left;
    margin-top: 10px;
    max-width: 100%;
    border: 1px solid
}

.eventCalendar .item.taiken {
    border-color: #4cbb8c;
    background-color: #4cbb8c
}

.eventCalendar .item.gakusetsu {
    border-color: #f6438a;
    background-color: #f6438a
}

.eventCalendar .item.guidance {
    border-color: #32d5b6;
    background-color: #32d5b6
}

.eventCalendar .item.other {
    border-color: #9a9eb6;
    background-color: #9a9eb6
}

.eventCalendar .item.is-end:after {
    display: block;
    position: absolute;
    top: -1px;
    left: -1px;
    content: '';
    z-index: 4;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    background: rgba(255, 255, 255, 0.8)
}

.eventCalendar .link {
    display: table;
    width: 100%
}

.eventCalendar .date,
.eventCalendar .heading {
    display: table-cell;
    vertical-align: middle;
    line-height: 1.3;
    white-space: nowrap
}

.eventCalendar .heading {
    width: 100px;
    color: #fff;
    text-align: center
}

.eventCalendar .heading span {
    display: block;
    padding: 4.5px 0;
    margin: 0 7px 8px;
    background: #000;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .025em
}

.eventCalendar .date {
    width: 140px;
    height: 100%;
    background: #fff;
    text-align: center
}

@media (min-width:68.8125em) {
    .eventCalendar .month {
        width: 17.75701%;
        font-size: 24px
    }

    .eventCalendar .month span {
        font-size: 35px
    }

    .eventCalendar .body {
        padding: 40px 0 40px 30px;
        width: 82.24299%
    }

    .eventCalendar .item {
        margin-right: 20px;
        width: 240px
    }

    .eventCalendar .date,
    .eventCalendar .heading {
        height: 60px
    }

    .eventCalendar .heading {
        font-size: 15px
    }

    .eventCalendar .day {
        font-size: 31px
    }

    .eventCalendar .day-of-the-week,
    .eventCalendar .day .label {
        font-size: 18px
    }
}

@media (max-width:68.75em) {
    .eventCalendar .month {
        width: 4em;
        font-size: 18px
    }

    .eventCalendar .month span {
        font-size: 25px
    }

    .eventCalendar .body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 30px 0 30px 20px;
        width: 100%
    }

    .eventCalendar .item {
        margin-top: 0;
        margin-top: 10px;
        width: 48.5%
    }

    .eventCalendar .item:first-child,
    .eventCalendar .item:nth-child(2) {
        margin-top: 0
    }

    .eventCalendar .date,
    .eventCalendar .heading {
        height: 55px
    }

    .eventCalendar .heading {
        font-size: 13px
    }

    .eventCalendar .day {
        font-size: 25px
    }

    .eventCalendar .day-of-the-week,
    .eventCalendar .day .label {
        font-size: 13px
    }
}

@media (min-width:48.0625em) {
    .eventCalendar .link {
        -webkit-transition: 0.3s opacity;
        transition: 0.3s opacity;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

    .eventCalendar .link:hover {
        opacity: .7
    }
}

@media (max-width:40em) {
    .eventCalendar .month {
        font-size: 13px
    }

    .eventCalendar .month span {
        font-size: 20px
    }

    .eventCalendar .date {
        width: 120px
    }

    .eventCalendar .item {
        margin-top: 0;
        margin-top: 10px;
        width: 100%
    }

    .eventCalendar .item+.item {
        margin-top: 10px
    }
}

@media (max-width:20em) {
    .eventCalendar .month {
        font-size: 11px
    }

    .eventCalendar .heading {
        width: 50%
    }

    .eventCalendar .date {
        width: 50%
    }
}

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

.jobList-box .icon {
    display: block;
    margin-left: auto;
    margin-right: auto;
    color: #6f748f;
    text-align: center
}

.jobList-box-name {
    margin-bottom: .5em;
    width: 100%;
    color: #6f748f;
    font-size: 17px;
    font-weight: bold;
    text-align: center
}

@media (min-width:48.0625em) {
    .jobList:after {
        content: '';
        display: block;
        width: calc(100% / 3)
    }

    .jobList-box {
        padding: 40px 4.8%;
        margin-bottom: 40px;
        width: calc(100% / 3)
    }

    .jobList-box+.jobList-box,
    .jobList-box:first-child {
        border-left: 1px solid #e7e8ee
    }

    .jobList-box .icon {
        font-size: 80px
    }

    .jobList-box-name {
        margin-top: 40px
    }
}

@media (max-width:48em) {
    .jobList-box {
        width: 50%;
        padding: 20px 1.5em;
        margin-bottom: 30px
    }

    .jobList-box-name {
        margin-top: 20px
    }

    .jobList-box .icon {
        font-size: 60px
    }
}

@media (min-width:30.0625em) {
    .jobList-box:nth-child(2n) {
        border-left: 1px solid #e7e8ee
    }
}

@media (max-width:30em) {
    .jobList-box {
        padding: 30px 1em 0;
        margin-bottom: 0;
        width: 100%
    }

    .jobList-box+.jobList-box {
        border-top: 1px solid #e7e8ee;
        margin-top: 30px
    }

    .jobList-box .icon {
        font-size: 50px
    }
}

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

.campusCalendar-box-heading {
    line-height: 1.4;
    border-bottom: 1px solid #9a9eb6;
    margin-bottom: 20px
}

.campusCalendar-box img {
    display: block;
    margin-bottom: 1em
}

@media (min-width:48.0625em) {
    .campusCalendar {
        margin-bottom: -100px
    }

    .campusCalendar:after {
        content: '';
        display: block;
        width: 31.7757%
    }

    .campusCalendar-box {
        width: 31.7757%;
        margin-bottom: 100px
    }

    .campusCalendar-box-heading {
        font-size: 24px
    }

    .campusCalendar-box-heading span {
        font-size: 56px
    }
}

@media (max-width:48em) {
    .campusCalendar {
        margin-bottom: -40px
    }

    .campusCalendar-box {
        width: 48%;
        margin-bottom: 40px
    }

    .campusCalendar-box-heading span {
        font-size: 30px
    }
}

.renunionSchedule {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border: solid #e7e8ee;
    border-width: 1px 0 0 1px
}

.renunionSchedule li {
    width: 25%;
    padding: 1.8em 1.8em 2.2em;
    border: solid #e7e8ee;
    border-width: 0 1px 1px 0
}

.renunionSchedule .month {
    display: inline-block;
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1.6;
    margin-bottom: .4em;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #e7e8ee));
    background: linear-gradient(transparent 60%, #e7e8ee 60%)
}

.renunionSchedule .text {
    display: block
}

@media (max-width:48em) {
    .renunionSchedule li {
        width: 33.3333%
    }
}

@media (max-width:40em) {
    .renunionSchedule li {
        width: 50%;
        padding: 1.5em
    }
}

.employmentSituation {
    max-width: 514px
}

.employmentSituation img {
    width: 372px
}

.internSystem img {
    width: 410px
}

.internInterview-img {
    width: 220px
}

.internInterview-heading {
    font-size: 1.2rem;
    font-weight: bold
}

.internInterview-profile {
    margin: 1em 0 1em;
    border: 1px solid
}

.biyou .internInterview-profile {
    border-color: #e7e8ee
}

.kango .internInterview-profile {
    border-color: #e7e8ee
}

.kyosei .internInterview-profile {
    border-color: #e7e8ee
}

.internInterview-profile span {
    font-weight: bold;
    padding-right: .4em
}

.biyou .internInterview-profile span {
    color: #f6438a
}

.kango .internInterview-profile span {
    color: #4cbb8c
}

.kyosei .internInterview-profile span {
    color: #32d5b6
}

.internInterview-profile .icon {
    display: inline-block;
    vertical-align: middle;
    margin: -2px .3em 0 0
}

@media (min-width:48.0625em) {
    .internInterview {
        display: table;
        width: 100%
    }

    .internInterview+.internInterview {
        margin-top: 20px
    }

    .internInterview-body,
    .internInterview-img {
        display: table-cell;
        vertical-align: top
    }

    .internInterview-body {
        padding-left: 30px
    }

    .internInterview-profile {
        padding: .6em 1em .5em;
        width: 455px
    }
}

@media (max-width:48em) {
    .internInterview+.internInterview {
        margin-top: 40px
    }

    .internInterview-img {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px
    }

    .internInterview-profile {
        padding: 1em 1em
    }
}

.gradVoiceList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 40px
}

.gradVoiceList img {
    width: 100%
}

.gradVoiceList:after {
    display: block;
    content: ''
}

.gradVoiceList-box {
    position: relative;
    border: 1px solid
}

.gradVoiceList-box.biyou {
    border-color: #f6438a
}

.gradVoiceList-box.kango {
    border-color: #4cbb8c
}

.gradVoiceList-box.kyosei {
    border-color: #32d5b6
}

.gradVoiceList-box-label {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    padding: .5em 0;
    width: 150px;
    color: #fff;
    font-weight: bold;
    text-align: center
}

.gradVoiceList-box.biyou .gradVoiceList-box-label {
    background: #f6438a
}

.gradVoiceList-box.kango .gradVoiceList-box-label {
    background: #4cbb8c
}

.gradVoiceList-box.kyosei .gradVoiceList-box-label {
    background: #32d5b6
}

.gradVoiceList-box-label .icon {
    margin: -2px .5em 0 0
}

.gradVoiceList-box-title {
    font-size: 1.2rem;
    font-weight: bold
}

.gradVoiceList-box.biyou .gradVoiceList-box-title {
    color: #f6438a
}

.gradVoiceList-box.kango .gradVoiceList-box-title {
    color: #4cbb8c
}

.gradVoiceList-box.kyosei .gradVoiceList-box-title {
    color: #32d5b6
}

.gradVoiceList-box-body {
    padding: 1em
}

@media (min-width:48.0625em) {
    .gradVoiceList:after {
        display: block;
        content: '';
        width: 32%
    }

    .gradVoiceList-box {
        width: 32%
    }

    .gradVoiceList-box-img {
        position: relative
    }

    .gradVoiceList-box-img:before {
        display: block;
        position: absolute;
        display: block;
        content: '';
        z-index: 1;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        -webkit-transition: opacity 0.6s;
        transition: opacity 0.6s;
        -webkit-transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1);
        transition-timing-function: cubic-bezier(0.52, 0.08, 0.18, 1)
    }

    .gradVoiceList-box.biyou .gradVoiceList-box-img:before {
        background: rgba(246, 67, 138, 0.4)
    }

    .gradVoiceList-box.kango .gradVoiceList-box-img:before {
        background: rgba(56, 115, 237, 0.4)
    }

    .gradVoiceList-box.kyosei .gradVoiceList-box-img:before {
        background: rgba(50, 213, 182, 0.4)
    }

    .gradVoiceList-box-link:hover .gradVoiceList-box-img:before {
        opacity: 1
    }
}

@media (max-width:48em) {
    .gradVoiceList:after {
        display: block;
        content: '';
        width: 48.5%
    }

    .gradVoiceList-box {
        width: 48.5%;
        margin-bottom: 40px
    }
}

@media (max-width:40em) {
    .gradVoiceList:after {
        display: block;
        content: none
    }

    .gradVoiceList-box {
        width: 4100%
    }
}

.gradVoiceProfile {
    max-width: 100%
}

.gradVoiceProfile .extraProfile-body {
    width: 600px;
    max-width: 92%;
    margin-left: auto;
    margin-right: auto
}

.grad-student-name {
    padding-right: 1em
}

.officeInfo {
    padding: 30px 20px;
    background: #e7e8ee
}

.officeInfo-heading {
    padding-bottom: 5px;
    margin-bottom: .8rem;
    border-bottom: 1px solid #9a9eb6;
    font-weight: bold
}

.officeInfo-img img {
    width: 100%
}

.officeInfo-body p:not([class])+p:not([class]) {
    margin-top: 1em
}

.officeInfo-detail {
    overflow: hidden
}

.officeInfo-detail dt {
    float: left;
    clear: left;
    width: 6em
}

.officeInfo-detail dd {
    float: left
}

.officeInfo-detail dd a {
    text-decoration: underline
}

@media (min-width:40.0625em) {
    .officeInfo {
        display: table;
        width: 100%
    }

    .officeInfo-heading {
        font-size: 1.2rem
    }

    .officeInfo-body,
    .officeInfo-img {
        vertical-align: top;
        display: table-cell
    }

    .officeInfo-img {
        width: 36%
    }

    .officeInfo-body {
        padding-left: 30px
    }
}

@media (max-width:40em) {
    .officeInfo-img {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 1.25em
    }
}

.kaigyouCase {
    margin-bottom: 70px
}

.kaigyouCase-img>img {
    width: 100%;
    margin-bottom: 10px
}

@media (min-width:48.0625em) {
    .kaigyouCase {
        margin-bottom: 70px
    }

    .kaigyouCase-container {
        display: table;
        width: 100%
    }

    .kaigyouCase-body,
    .kaigyouCase-img {
        display: table-cell;
        vertical-align: top
    }

    .kaigyouCase-img {
        width: 31.2%
    }

    .kaigyouCase-body {
        padding-left: 40px
    }
}

@media (max-width:48em) {
    .kaigyouCase {
        margin-bottom: 40px
    }

    .kaigyouCase-img {
        width: 100%;
        margin-bottom: 1em
    }
}

.sitemap:after {
    display: block;
    content: ''
}

.sitemap ul>li>a:not([class]) {
    color: #000;
    text-decoration: none
}

.sitemap-box-heading {
    margin-bottom: 20px;
    border-bottom: 1px solid #9a9eb6;
    font-weight: bold;
    line-height: 2
}

.sitemap-box-heading .icon {
    margin: -2px 0 0 .5em;
    color: #9a9eb6;
    font-size: 13px
}

.sitemap-box ul li.has-blank {
    list-style-type: none
}

.sitemap-box ul li.has-blank a:before {
    content: "－";
    color: #9a9eb6
}

.sitemap-box .hide-in-sitemap {
    display: none
}

@media (min-width:48.0625em) {
    .sitemap:after {
        width: 30%
    }

    .sitemap-box {
        width: 30%;
        margin-bottom: 100px
    }

    .sitemap-box-heading a {
        -webkit-transition: color 0.3s;
        transition: color 0.3s
    }

    .sitemap-box-heading a:hover {
        color: #32d5b6
    }

    .sitemap ul>li>a:not([class]):hover {
        text-decoration: underline
    }
}

@media (max-width:48em) {
    .sitemap:after {
        width: 48.5%
    }

    .sitemap-box {
        width: 48.5%;
        margin-bottom: 60px
    }
}

@media (min-width:30.0625em) {
    .sitemap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .sitemap-box-heading {
        font-size: 18px
    }
}

@media (max-width:30em) {
    .sitemap:after {
        width: 100%
    }

    .sitemap-box {
        width: 100%;
        margin-bottom: 40px
    }

    .sitemap-box:last-child {
        margin-bottom: 0
    }

    .sitemap-box-heading {
        font-size: 1.2rem
    }
}

.preload * {
    -webkit-transition: none !important;
    transition: none !important
}

.js-loading-done .mainVisual-copy {
    visibility: visible
}

.js-loading-done .mainVisual-copy-border {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.js-loading-done .mainVisual-copy .en,
.js-loading-done .mainVisual-copy .ja {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition-delay: 1s;
    transition-delay: 1s
}

.js-loading-done .globalNav li.current a:before {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transition-delay: 2s;
    transition-delay: 2s
}

.js-menu-open .hamburger {
    z-index: 13
}

.js-menu-open .hamburger-line1 {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 28px
}

.js-menu-open .hamburger-line2 {
    opacity: 0
}

.js-menu-open .hamburger-line3 {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 28px
}

.js-menu-open .drawerMenu {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.js-open-visitor-menu .visitorMenu-list {
    opacity: 1;
    -webkit-transform: scaleY(1);
    transform: scaleY(1)
}

.is-active .megaMenu {
    opacity: 1;
    pointer-events: auto;
    -webkit-transition: opacity 0.25s cubic-bezier(0.445, 0.05, 0.55, 0.95) 0.2s, visibility 0.25s cubic-bezier(0.445, 0.05, 0.55, 0.95) 0.2s;
    transition: opacity 0.25s cubic-bezier(0.445, 0.05, 0.55, 0.95) 0.2s, visibility 0.25s cubic-bezier(0.445, 0.05, 0.55, 0.95) 0.2s
}

.js-open-megamenu .megaMenuBg {
    -webkit-transform: scaleY(1);
    transform: scaleY(1)
}

.js-open-megamenu .megaMenuOverlay {
    opacity: 1;
    visibility: visible;
    pointer-events: auto
}
@media (max-width:52.5625em){
    .annouce-section {
        padding-top: 0;
        padding-bottom: 40px;
        margin-top: 74px;
    }
    .frontAnnouce-circleBanner .primary {
        margin-bottom: 20px;
    }
}
@media (max-width: 30em) {
    .annouce-section{
        margin-top: -23%;
    }
    .frontAnnouce-circleBanner {
        margin-top: 0;
    }
}
.footer_new_banner a {
    width: 50%;
    display: inline-block;
    margin-bottom: 40px;
}
.footer_new_banner a:first-child {
    padding-right: 8px;
}
.footer_new_banner a:last-child {
    padding-left: 8px;
}
@media all and (max-width: 768px) {
    .footer_new_banner a {
        display: block;
        width: 100%;
    }
        .footer_new_banner a:first-child {
        padding-right: 0;
        margin-bottom: 20px;
    }
    .footer_new_banner a:last-child {
        padding-left: 0;
    }
}