@charset "utf-8";
/*リセットCSS（ress.css）の読み込み
---------------------------------------------------------------------------*/
/*@import url("https://unpkg.com/ress/dist/ress.min.css");*/
@import url("https://www.s.u-tokyo.ac.jp/ress.min.css");


/*Font Awesomeの読み込み
---------------------------------------------------------------------------*/
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css");

@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css");

/*slick.cssの読み込み
---------------------------------------------------------------------------*/
@import url("https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css");

/*ページネーションCSSの読み込み
---------------------------------------------------------------------------*/
@import url("jPages.css");
@import url("animate.css");

/*下層ページ用CSS
---------------------------------------------------------------------------*/
@import url("style-page.css");

/*重要なお知らせ（表示切替）
非表示にする場合は、display:block; を display:none;にしてください。
---------------------------------------------------------------------------*/
#HeaderInfo {
    display:block;
}

/*全体の設定
---------------------------------------------------------------------------*/
html {
    scroll-behavior: smooth;
}
html,body {
	font-size: 14px;	/*基準となるフォントサイズ。下の方にある「画面幅800px以上」で基準を大きなサイズに変更しています。*/
}

body {
	overflow-x: hidden;
	font-family: MessinaSans, Arial, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;	/*フォント種類*/
	font-weight:500;
	-webkit-text-size-adjust: none;
	background: #fff;	/*背景色*/
	color: #333;	/*全体の文字色*/
	line-height: 2;		/*行間*/
}

/*明朝体の箇所*/
.admissionLeft p,
#ResearchFacility > h3,
#Graduate .GL-Item h3,
#Graduate > p,
p.GS-Text,
p.GS-TopText,
.MainVisual .cont-inner .sub-text,
#IT-All p.IT-SubText {
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

/*table全般の設定*/
table {border-collapse:collapse;}

/*画像全般の設定*/
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}
.Entry main img {border: none;max-width: 100%;height: auto;vertical-align: middle;margin:3px 6px 3px 0px;}
/*section全般の設定*/
section + section {
	padding-top: 30px;	/*sectionの間に空けるスペース*/
}

/*フォームタグ全般の設定*/
input, textarea, select {
	border: 1px solid #999;	/*枠線の幅、線種、色*/
	padding: 0 10px;
}

/*ress.cssでselectで矢印が消えてしまうのを戻す*/
select {
	-moz-appearance: menulist;
	-webkit-appearance: menulist;
	appearance: menulist;
}
select::-ms-expand {
    display: block;	/*IE用*/
}

/*videoタグ*/
video {max-width: 100%;}

/*iframeタグ*/
iframe {max-width: 100%;}

/*ulタグ、olタグ*/
ul,ol {
	margin: 0 5px 30px 25px;	/*上、右、下、左へ空けるスペース*/
}

/*Flexクラスの設定
---------------------------------------------------------------------------*/
.Flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

/*重要なお知らせ
---------------------------------------------------------------------------*/
/*重要なお知らせ全体*/
#HeaderInfo {
	background-color: #FDB812; /* 重要なお知らせ全体の背景色 */
	transition:background-color 0.2s ease-in-out;
	letter-spacing: 1px;	/*テキストの字間*/
}
#HeaderInfo:hover{
	background-color: #f3b013; /* 重要なお知らせ全体のホバー時背景色 */
}
#HeaderInfo > a > .Right > .Flex,
#HeaderInfo > a > .Left > .Flex{
	height: 100%;	/*上下中央寄せをするために高さを設定*/
	-webkit-box-align: center;
	-ms-flex-align: center;
    align-items: center;	/*上下中央寄せに設定*/
}
/*タイトルとアイコン*/
.HI_Link{
	padding: 15px 10px 14px 10px;
}
.HI_Link {
	text-decoration: none;
}
.HI_Link:hover {
	color: initial;
}
.HI_Link > .Left {
    width: 255px;	/*『アイコン＋重要なお知らせタイトル』 の固定幅*/
	border-right: 1px solid #DFAB31;
}
.HI_Link > .Right {
    width: calc(100% - 255px);	/*『アイコン＋重要なお知らせタイトル』の固定幅を100%幅から引いた値*/
	padding-left: 40px;
}
.HI_Icon > span {
	vertical-align: middle;	/*重要なお知らせタイトル横のアイコンの位置を上下中央寄せに設定*/
	font-size: 35px;	/*重要なお知らせタイトル横のアイコンサイズ*/
    margin-right: 8px;	/*重要なお知らせタイトルとアイコンとの距離*/
	padding-bottom: 2px;	/*上下位置の微調整*/
}
.HI_Link > .Left > .Flex {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;	/*『アイコン＋重要なお知らせタイトル』を左右中央寄せに設定*/
}
.HI_Title > div{
	line-height:37px;	/*重要なお知らせタイトルの上下位置調整*/
	font-size:18px;
}
/*日付と詳細テキスト*/
#HeaderInfo > a > .Right > .Flex {
    line-height: 120%;	/* 行間を120%に設定 */
}
.HI_Date {
	margin-right: 20px;	/*詳細テキストとの距離*/
	font-size: 14px;
	color: #555;
}
.HI_Text {
	font-size:16px;
}
.HI_Container.Flex,
.HI_Container .Flex{
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
    -ms-flex-wrap: nowrap;
  	flex-wrap: nowrap;
}
.HI_Container > .Left {
    padding-right: 30px;
	min-width: 200px;
}
.HI_Container > .Right {
    padding-left: 30px;
    border-left: 1px solid #ccaa4d;
}
.HI_Container > .Right .HI_Date{
    margin-right: 30px;
}
.HI_Container > .Right .HI_Text,
.HI_Container > .Right .HI_Date{
    font-size: 13px;
	line-height: 115%;
}
.HI_Container > .Right .HI_Date{
    color: #625d51;
}
.HI_Container > .Right .HI_Text a {
    padding: 0px;
    line-height: 100%;
}
.HI_Container > .Right > .Flex:not(:last-child){
	margin-bottom: 13px;
}
div#HeaderInfo {
    padding: 20px 20px
}

/*opa1（透明から着色状態に）
---------------------------------------------------------------------------*/
@keyframes opa1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

/*リンクテキスト全般の設定
---------------------------------------------------------------------------*/
a {
	color: #333;	/*文字色*/
}

a:hover {
	color: #2584C6;	/*マウスオン時の文字色*/
}

/*container。サイト全体を囲むブロック。
---------------------------------------------------------------------------*/
#container {
	margin: 0 auto;
	max-width: 100%;	/*最大幅。これ以上幅が広がらないように。*/
}

/*Googleカスタム検索
---------------------------------------------------------------------------*/
/*全体の入れ物*/
body .gsc-control-cse {
	background-color: rgba(0,57,115,0.9);
	border: none;
}
/*検索フォームとボタンの入れ物*/
body table.gsc-search-box {
	height: 100%;
}
/*検索ボタン*/
body .gsc-search-button-v2 {
	height: 100%;
	background-color: #2584C6;
	border: 1px solid #2584C6;
	border-radius: 0px;
}
body .gsc-search-button-v2:hover {
	background-color: #002245;
}

/*header。ロゴなどが入った最上段のボックス。
---------------------------------------------------------------------------*/
header {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	background-color: white;
	min-width: 100%;
	max-width: 100%;
	transition: top 0.5s ease-in-out;
	z-index: 998; /*メインビジュアルよりも上に設定*/
}
header.Fixed{
	/* border-bottom:1px solid #f0f0f0; */
	position: fixed;
	top: 0px;
	left: 0px;
}
header ul {
	list-style: none;
}
/*logo画像 (header > primary)*/
header .primary {
	width: 234px;
    max-width: 234px;	/*ヘッダープライマリコンテンツの幅*/
    text-align: left;
}
header #logo {
	width: auto;	/*画像の幅*/
	margin: 0 auto;	/*左右中央に配置する*/
	line-height: 280%;
}
/*メインメニュー*/
header .secondary {
	width: calc(100% - 234px - 170px);
    max-width: calc(100% - 234px - 170px);
	font-size: 13px;
    font-weight: bold;
    text-align: left;
	padding-right: 20px;
}
/*ヴィジターおよび言語メニュー*/
header .tertiary {
	width: 160px;
    max-width: 160px;
    text-align: center;
	font-size: 15px;
    font-weight: bold;
}

/*電話番号*/
header address {
	font-style: normal;	/*addressタグがデフォルトで斜体なので、通常にする。*/
}

/*電話番号のアイコン（アイコンにはFont Awesomeを使用）*/
header i {
	padding-right: 10px;	/*右側に空ける余白*/
}

/*address内のspanタグ。受付時間などの行です。*/
header address span {
	display: block;
	font-size: 0.7rem;	/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
}

/*３本バー（ハンバーガー）アイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	display: block;
	position: fixed;
	z-index: 999;
	top: 10px;		/*上からの配置場所*/
	right: 10px;	/*左からの配置場所*/
	width: 50px;	/*幅*/
	height: 50px;	/*高さ*/
	border-radius: 50%;
	background: #3551de url(https://www-images.s.u-tokyo.ac.jp/ja/images/icon_menu.png) no-repeat center top/50px;	/*背景色、背景画像の読み込み、画像の上半分（３本マーク）を表示。幅は50px。*/
}

/*小さな端末用のメニューが開いた段階の３本バーの設定。×印が出ている状態の設定。*/
#menubar_hdr.close {
	background: #ff0000 url(https://www-images.s.u-tokyo.ac.jp/ja/images/icon_menu.png) no-repeat center bottom/50px;	/*背景色、背景画像の読み込み、画像の下半分（×マーク）を表示。幅は50px。*/
}

/*大きな端末用のメインメニューの設定
---------------------------------------------------------------------------*/
#menubar {
	display: none;	/*非表示にしておく*/
}

/*小さな端末用のメインメニューの設定
---------------------------------------------------------------------------*/
/*ボックス全体の設定*/
#menubar-s {
	display: none;				/*デフォルトで非表示にしておく*/
	animation-name: opa1;		/*keyframes.cssで使う@keyframesの指定*/
	animation-duration: 1S;		/*アニメーションの実行時間*/
	animation-fill-mode: both;	/*アニメーションの待機中は最初のキーフレームを維持、終了後は最後のキーフレームを維持。*/
	background: #3551de;		/*背景色*/
	position: fixed;	/*fixedはスクロールしても動かない為の指定*/
	overflow: auto;
	z-index: 99;	
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	padding: 50px;		/*ボックス内の余白。色がついた部分と、メニューがある白いブロックとの差です。*/
	text-align: center;	/*テキストをセンタリング*/
}

/*nav要素*/
#menubar-s nav {
	height: 100%;
	background: #fff;		/*背景色。下の「#menubar-s ul」と揃えておいて下さい。*/
	padding: 20px;			/*ボックス内の余白。メニューにスクロールバーが出た場合に適度な余白をとる為です。*/
	border-radius: 30px;	/*角を丸くする指定。直角がいいならこの１行を削除。*/
}

/*ul要素。メニュー１個１個を囲む親のボックス。*/
#menubar-s ul {
	margin: 0;
	height: 100%;
	list-style: none;
	padding: 20px;	/*ボックス内の余白*/
	background: #fff;		/*背景色。上の「#menubar-s nav」と揃えておいて下さい。*/
	overflow: auto;			/*中身が高さを超える場合に自動でスクロールを出す設定*/
}

/*メニュー１個あたりの設定*/
#menubar-s li {
	margin-bottom: 20px;	/*メニュー同士の余白。*/
}

/*リンクテキスト*/
#menubar-s a {
	text-decoration: none;
	display: block;
	color: #333;		/*文字色*/
	padding: 10px 0;	/*上下、左右への余白*/
	transition: 0.3s;	/*0.3秒かけてアニメーションする設定。マウスオン時に影響します。*/
}

/*アイコン画像（アイコンにはFont Awesomeを使用）*/
#menubar-s i {
	display: block;			/*改行が入るようにblock指定。もし横に並べたいならこの１行を削除し、下のpadding-bottomをpadding-rightに変更すればOK。*/
	padding-bottom: 10px;	/*テキストとの余白調整*/
	color: #3551de;			/*文字色＝アイコン色になります。*/
}

/*英字の装飾テキスト*/
#menubar-s li span {
	display: block;
	font-size: 0.5rem;		/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
	color: #ccc;			/*文字色*/
	letter-spacing: 0.2em;	/*文字間隔を少し広くとる指定。*/
}

/*スクロールバーのカスタマイズ（※対応しているブラウザは限られます）*/
#menubar-s ul::-webkit-scrollbar {
	width: 8px;	/*スクロールバーの幅*/
}

/*スクロールバー本体（色のついた部分）*/
#menubar-s ul::-webkit-scrollbar-thumb {
    background: #3551de;
}

/*スクロールバーの背景部分（グレー色の部分）*/
#menubar-s ul::-webkit-scrollbar-track {
    background: #eee;
}

/*共通設定。角を丸くする指定。直角がいいならブロックごと削除。*/
#menubar-s ul::-webkit-scrollbar-thumb,
#menubar-s ul::-webkit-scrollbar-track {
    border-radius: 50px;	/*ある程度大きければ適当でOKです*/
}

/*header内のanchor
---------------------------------------------------------------------------*/
header a {
    text-decoration: none;
}


/*pc__global-1メニュー
---------------------------------------------------------------------------*/
#pc__global-1 .Flex {
    -webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
    -webkit-box-align: baseline;
	-ms-flex-align: baseline;
	align-items: baseline;
	margin: 20px 0px 0px 0px;
}
#pc__global-1 .Flex li:not(.toudai-link) {
    margin-top:5px;
    font-size: 12px;
    font-weight: bold;
    margin-left: 20px;
}
#pc__global-1 .Flex .material-icons-outlined {
    font-size:19px;
    color: #2584C6;
    vertical-align: middle;
    margin-bottom:3px;
    margin-right: 6px;
    transition: color 0.2s ease-in-out;
}
#pc__global-1 .Flex a{
    color: #555555;
    transition: color 0.2s ease-in-out;
}
#pc__global-1 a.bgc-white__button {
    background-color: white;
    color: #2481c5;
    border: 1px solid #2481c5;
    padding: 11px 13px 10px 11px;
    border-radius: 5px;
    transition: color 0.2s ease-in-out , background-color 0.2s ease-in-out;
}
#pc__global-1 a.bgc-white__button:hover > .material-icons-outlined{
    color: white;
    background-color: transparent;
}
#pc__global-1 a.bgc-white__button:hover {
    background-color: #2481c5;
    color: white;
}
#pc__global-1 a:hover {
    color: #2481c5;
}
/*pc__global-2メニュー
---------------------------------------------------------------------------*/
#pc__global-2 .Flex {
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-webkit-box-align: baseline;
	-ms-flex-align: baseline;
	align-items: baseline;
	margin: 0px;
	padding: 5px 0px 0px 0px;
}
#pc__global-2 > ul > li {
    margin: 0px 10px;
    position: relative;
}
#pc__global-2 > ul > li:last-child {
    margin-right: 0px;
}
#pc__global-2 > ul > li:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 13px;
    top: 10px;
    left:-10px;
    background-color: #CCCCCC;
    transform: rotate(12deg);
}
#pc__global-2 > ul > li:first-child:before{
    display: none;
}
/*pc__global-2サブメニュー関連
---------------------------------------------------------------------------*/
#pc__global-2 > ul.Flex {
    position: relative;
}
#pc__global-2 > ul.Flex .pc__haschild{
    position: relative;
    font-size:14px;
    letter-spacing: 0.3px;
    display: block;
    padding-bottom: 20px;
    padding-top: 10px;
    position: relative;
    cursor: default;
}
#pc__global-2 > ul.Flex .pc__haschild:after{
    position: absolute;
    content: "";
    width: calc(100% + 20px);
    left: -10px;
    top:100%;
    height: 5px;
    z-index:999;
}
#pc__global-2 > ul.Flex .pc__child {
    position: absolute;
    top: calc(100%  + 5px);
    z-index: 999;
    background-color: white;
    min-width: 320px;
    width: 250%;
    left: 50%;
    transform: translateX(-50%);
    display: none;
    margin: 0px;
    padding: 25px
}

#pc__global-2 > ul > li.pc__haschild {
    line-height: 100%;
}
#pc__global-2 > ul > li.pc__haschild > ul {
    line-height: 200%;
}
#pc__global-2 > ul > li.pc__haschild > a {
    display: block;
    padding-bottom: 20px;
    padding-top: 10px;
    position: relative;
}
#pc__global-2 > ul > li.pc__haschild > a:after {
    position: absolute;
    content: "";
    width: 0%;
    height: 3px;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #2584C6;
    transition: width 0.2s ease-in-out;
}
#pc__global-2 > ul > li.pc__haschild:hover a:after {
    width: 100%;
}
#pc__global-2 .pc__child li {
    padding: 8px 15px;
    font-size: 13px;
    position: relative;
}
#pc__global-2 .pc__child li ul li {
    padding: 4px 15px;
    font-size: 12px;
} 
#pc__global-2 .pc__child li.pc__has-grandchild:after,
#pc__global-2 .pc__child li:before {
    position: absolute;
    font-family: "Material Icons";
    top: 50%;
    transform: translateY(-50%);
}
#pc__global-2 .pc__child li:before {
    content: "\eac9";
    left: 0px;
    color: #2584C6;
}
#pc__global-2 .pc__child > li.pc__has-grandchild:after {
    content: "\e409";
    right: 0px;
    color: #2584C6;
}
#pc__global-2 .pc__child > li a {
    display: block;
    line-height: 140%;
}
#pc__global-2 .pc__has-grandchild {
    position: relative;
}
#pc__global-2 .pc__has-grandchild > .pc__grandchild {
    position: absolute;
    top: 0px;
    left: 100%;
    width: 100%;
    margin: 0px;
    padding: 25px;
    background-color: white;
    display: none;
    box-shadow: 0px 0px 16px -6px rgb(0 0 0 / 60%);
}
#pc__global-2 .pc__has-grandchild:hover > .pc__grandchild {
    display: block;
    animation-name: opa1;
    animation-duration: 0.2s;
    animation-fill-mode: both; 
}
/*pc__global-2サブメニュー関連 2022/11/14追加
---------------------------------------------------------------------------*/
#pc__global-2 .pc__child li {
    padding-left: 20px;
}
#pc__global-2 .pc__child li:before {
    left: 3px;
}
#pc__global-2 .pc__child li:hover {
    background-color: rgba(0,0,0,0.025);
}
#pc__global-2 .pc__has-grandchild > .pc__grandchild {
    box-shadow: 10px 0px 10px 1px rgb(0 0 0 / 5%);
}

/*Visitor・言語メニュー
---------------------------------------------------------------------------*/
.tertiary > .Flex {
	height: 100%;
}
nav#pc__visitor {
    display:none;
}
div#pc__visitor-container {
    width: 78%;
    display: -webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
    /*
	border-left: 1px solid #dbedff;
	border-right: 1px solid #dbedff;
    */
    background-color:#003973;
}
nav.pc__language {
    width: 22%;
}
nav.pc__language ul {
    margin: 0px;
}
div#pc__visitor-trigger {
    width: 100%;
}
div#pc__visitor-trigger span.material-icons {
	font-size: 38px;
	vertical-align:bottom;
}
div#pc__visitor-trigger {
	font-size: 12px;
	color:#fff;
}
nav.pc__language > ul > li {
    height: 58px;
}
nav.pc__language > ul > li > a{
    display: block;
    width: 100%;
    height: 100%;
    line-height: 400%;
    color: #acacac;
    font-weight: 500;
    font-size: 14px;
    transition: color 0.2s ease-in-out;
}
nav.pc__language > ul > li > a:hover {
    color: #2584C8;
    font-weight: bold;
}
nav.pc__language > ul > li.active {
    background-color: #2584C8;
}
nav.pc__language > ul > li.active > a {
    color: white;
    font-weight: bold;
}
@media screen and (max-width:1189px){
    nav.pc__language > ul > li {
        height: 51px;
        width:30px;
        border-left:1px solid #5aa0d2;
    }
    nav.pc__language > ul > li > a{
        font-size: 12px;
    }
}
/*Visitor内メニュー
---------------------------------------------------------------------------*/
div#pc__visitor-container {
    position: relative;
}
div#pc__visitor-container #pc__visitor {
    position: absolute;
    top: calc(100% + 5px);
    right:0px;
    width: 332px;
    background-color: white;
    padding: 25px;
    z-index:999;
}
div#pc__visitor-container #pc__visitor {
    display: none;
}
nav#pc__visitor .Flex {
    font-size: 0px;
}
nav#pc__visitor .Flex > ul {
	margin: 0px;
	text-align: left;
}
nav#pc__visitor .Flex > ul > li{
    font-size: 15px;
    text-align: left;
    margin:0px;
}
nav#pc__visitor .Flex .w370px {
    width: 370px;
	padding-right: 15px;
}
nav#pc__visitor .Flex .w205px {
    width: 205px;
    padding-left: 15px;
	padding-right: 15px;
}
nav#pc__visitor .Flex .w225px {
    width: 225px;
    padding-left: 15px;
}
nav#pc__visitor .Flex .border-left {
    border-left: 1px solid #dbedff;
}
nav#pc__visitor .Flex .one-half {
    display: inline-block;
    max-width: 50%;
    margin: 0px 0px;
}
nav#pc__visitor .Flex .one-half:nth-of-type(3),
nav#pc__visitor .Flex .one-half:nth-of-type(5),
nav#pc__visitor .Flex .one-half:nth-of-type(7) {
    margin-left: 5px;
}
nav#pc__visitor .Flex .has_img {
	height: 100px;
	width: 175px;
	margin-bottom: 5px;
}
nav#pc__visitor .Flex .has_img > a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow:hidden;
}
nav#pc__visitor .Flex .has_img > a > img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    transition: transform 0.2s ease-in-out;
}
nav#pc__visitor .Flex .has_img  > a:hover img{
    transform: translate(-50%,-50%) scale(1.1,1.1);
}
nav#pc__visitor .Flex > ul > li:not(.has_img) {
	margin-bottom: 15px;
}
nav#pc__visitor .Flex > ul > li:not(.has_img) > a {
    position: relative;
    padding-left: 15px;

}
nav#pc__visitor .Flex > ul > li:not(.has_img) > a:before{
    position: absolute;
    font-family: 'Material Icons';
    content: "\eac9";
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    color:#2584C6;
}
div#pc__visitor-container:hover:after {
    position: absolute;
    content: "";
    width: 800px;
    height: 5px;
    top: 100%;
    right: 0px;
    background-color: transparent;
    z-index:999;
}
div#pc__visitor-container{
    transition: background-color 0.2s ease-in-out;
}
div#pc__visitor-container div#pc__visitor-trigger {
    transition: color 0.2s ease-in-out;
}
div#pc__visitor-container:hover {
    background-color: #fff;
    font-weight:bold;
}
div#pc__visitor-container:hover div#pc__visitor-trigger {
    color: #003973;
    font-weight:bold;
}

/*PC Visitorトリガーアイコン
---------------------------------------------------------------------------*/
#pc__visitor-container #pc__visitor-trigger {
    min-height: 100%;
    padding-top:22px;
    cursor: pointer;
    line-height:0.8;
}
#pc__visitor-container .BurgerIcon {
    position: relative;
    width: 36px;
    height: 26px;
    margin: 0px auto 7px auto;
    transition: all 0.4s ease-in-out;
}
#pc__visitor-container .BurgerIcon span {
    position: absolute;
    left: 0px;
    display: block;
    height: 2px;
    width: 100%;
    background-color: #003973;
    transition: all 0.4s ease-in-out;
    box-sizing: content-box;
}
#pc__visitor-container .BurgerIcon span:nth-last-of-type(1){
    top: 0px;
}
#pc__visitor-container .BurgerIcon span:nth-last-of-type(2){
    top: 50%;
    transform: translateY(-50%);
}
#pc__visitor-container .BurgerIcon span:nth-last-of-type(3){
    bottom: 0%;
}
#pc__visitor-container:hover .BurgerIcon {
    transform: rotate(0deg);
}
#pc__visitor-container:hover .BurgerIcon span{
    background-color: white;
}
#pc__visitor-container:hover .BurgerIcon span:nth-of-type(1){
    transform: translateY(-12px) rotate(-45deg);
}
#pc__visitor-container:hover .BurgerIcon span:nth-of-type(2){
    opacity: 0;
}
#pc__visitor-container:hover .BurgerIcon span:nth-of-type(3){
    transform: translateY(12px) rotate(45deg);
}
/*
div#pc__visitor-trigger br {
    display: none;
}
*/

/*pcサブメニュー共通ドロップシャドウとアニメーション
---------------------------------------------------------------------------*/
#pc__global-2 > ul.Flex .pc__child,
div#pc__visitor-container #pc__visitor {
    box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
}
#pc__global-2 > ul.Flex .pc__haschild:hover > .pc__child,
div#pc__visitor-container:hover #pc__visitor {
    display: block; 
    animation-name: opa1;
	animation-duration: 0.2s;
	animation-fill-mode: both;
}


/*SPヘッダーメニュー関連
---------------------------------------------------------------------------*/
#sp__global,
#sp__visitor {
    position: absolute;
    z-index: 9999;
    right: 0px;
    width: 100%;
    overflow: auto;
	/*topとheightの値はsp_menu.jsで設定*/
}
#sp__global {
    background-color: white;
}
#sp__global a {
    color: #003973;
}
#sp__visitor {
    background-color: #003973;
}
#sp__visitor a {
    color: white;
}
.quaternary > .Flex {
	height: 100%;
    text-align: center;
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
/*SPヘッダーメニュー関連 トリガーボタン
---------------------------------------------------------------------------*/
div#sp__visitor-container,
div#sp__global-container {
	height: 100%;
}
div#sp__visitor-trigger,
div#sp__global-trigger {
    width: 110px;
    height: 100%;
    line-height: 100%;
    font-size: 12px;
    color: white;
	padding: 18px 0px;
	cursor: pointer;
}
div#sp__visitor-trigger > .material-icons,
div#sp__global-trigger > .material-icons {
	font-size: 42px;
}
div#sp__visitor-trigger {
	background-color: #003973;
    transition:0.5s;
}
.active div#sp__visitor-trigger {
	background-color: #fff;
    color:#003973;
    font-weight:bold;
}
.active div#sp__visitor-trigger .material-symbols-outlined {
    font-weight:bold;
}
div#sp__global-trigger {
	background-color: #2584c8;
    transition:0.5s;
}
.active div#sp__global-trigger {
	background-color: #fff;
    color:#2584c8;
    font-weight:bold;
}
.active div#sp__global-trigger .material-symbols-outlined {
    font-weight:bold;
}

/*SPヘッダーメニュー関連 トリガーボタン　2022/11/15 変更に伴い追記
---------------------------------------------------------------------------*/
#sp__global-container #sp__global-trigger {
    padding-top: 18px;
    cursor: pointer;
}
div#sp__visitor-trigger > .material-icons {
    transition: all 0.4s ease-in-out;
}
#sp__global-container .BurgerIcon {
    position: relative;
    width: 32px;
    height: 22px;
    margin: 0px auto 10px auto;
    transition: all 0.4s ease-in-out;
}
#sp__global-container .BurgerIcon span {
    position: absolute;
    left: 0px;
    display: block;
    height: 2px;
    width: 100%;
    background-color: white;
    transition: all 0.4s ease-in-out;
    box-sizing: content-box;
}
#sp__global-container .BurgerIcon span:nth-last-of-type(1){
    top: 0px;
}
#sp__global-container .BurgerIcon span:nth-last-of-type(2){
    top: 50%;
    transform: translateY(-50%);
}
#sp__global-container .BurgerIcon span:nth-last-of-type(3){
    bottom: 0%;
}
#sp__global-container.active .BurgerIcon {
    transform: rotate(360deg);
}
#sp__global-container.active .BurgerIcon span:nth-of-type(1){
    transform: translateY(-10px) rotate(-45deg);
}
#sp__global-container.active .BurgerIcon span:nth-of-type(2){
    opacity: 0;
}
#sp__global-container.active .BurgerIcon span:nth-of-type(3){
    transform: translateY(10px) rotate(45deg);
}


/*SPヘッダーメニュー関連　アニメーション
---------------------------------------------------------------------------*/
#sp__global,
#sp__visitor {
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    border-top: 1px solid #ebebeb;
	display: none;
}
#sp__global-container.active #sp__global,
#sp__visitor-container.active #sp__visitor {
    opacity: 1;
}

/*SPヘッダーサブメニュー global1 and visitor
---------------------------------------------------------------------------*/
#sp__global,
#sp__visitor {
    padding: 30px 20px;
}
#sp__global > div ul,
#sp__visitor > div ul {
    margin: 0px;
}
#sp__global > div > ul > li > ul,
#sp__visitor > div > ul > li > ul {
    padding: 15px 20px;
    background-color: rgba(0,0,0,0.03);
}
#sp__visitor > div > ul > li > ul {
    background-color: rgba(0,0,0,0.1);
}
#sp__global > div > ul > li > ul ul,
#sp__visitor > div > ul > li > ul ul {
    margin-left: 1em;
}
.sp__global1 li,
.sp__visitor-menu li{
    text-align: left;
    line-height: 130%;
    padding: 0px;
}
.sp__global1 > li,
.sp__visitor-menu > li{
    margin-bottom: 20px;
}
.sp__global1 li > a, 
.sp__visitor-menu li > a {
    display: inline-block;
    padding: 9px 0em 9px 1em;
    position: relative;
    font-size: 15px;
}
.sp__global1 li > a:before, 
.sp__visitor-menu li > a:before {
    position: absolute;
    font-family: "Material Icons";
    content: "\eac9";
    top: 50%;
    left: 0px;
    transform: translateY(-50%);
}
.sp__global1 li li > a:before, 
.sp__visitor-menu li li > a:before {
    content: "\e5cc";
}
.sp__global1 li li li > a:before, 
.sp__visitor-menu li li li > a:before {
    content: "\f108";
    font-size: 10px;
}
.sp__global1 .sp__child,
.sp__visitor-menu .sp__child {
    display: none;
}
.sp__global1 .sp__haschild.sp_active .sp__child,
.sp__visitor-menu .sp__haschild.sp_active .sp__child {
    display: block;
}
.sp__global1 .sp__haschild > a,
.sp__visitor-menu .sp__haschild > a {
    width: calc(100% - 70px);
}
span.childTrigger {
    display: inline-block;
    width: 70px;
    height: 100%;
    position: relative;
}
span.childTrigger:before {
    position: absolute;
    font-family: "Material Icons";
    content: "\e145";
    right: 0px;
    top: -6px;
    transform: translateY(-50%);
    font-size: 30px;
	cursor: pointer
}
.sp_active span.childTrigger:before {
    content: "\e15b";
}
.sp__visitor-menu .childTrigger {
    color: white;
}
.sp__global1 .childTrigger {
    color: #003973;
}
.no-links {
    pointer-events:none;
}
/*SPヘッダーサブメニュー global2
---------------------------------------------------------------------------*/
#sp__global ul.sp__global2.Flex {
    -webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
    margin: 40px 0px;
}
#sp__global ul.sp__global2.Flex > li {
    width: 20%;
}
#sp__global ul.sp__global2.Flex > li > a {
    border: 1px solid #2481c5;
    color: #2481c5;
    font-weight: bold;
    font-size: 14px;
    display: block;
    width: 100%;
    padding: 12px 5px 9px 5px;
    text-align: center;
    line-height: 100%;
    border-radius: 5px;
}
#sp__global ul.sp__global2.Flex > li:last-child > a {
    background-color: #2481c5;
    color: white;
}
#sp__global ul.sp__global2.Flex > li > a .material-icons-outlined {
    font-size: 16px;
    vertical-align: middle;
    padding-bottom: 3px;
    margin-right: 3px;
}

/*SPヘッダーサブメニュー language
---------------------------------------------------------------------------*/
#sp__global ul.sp__language.Flex {
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
    margin-bottom: 40px;
}
#sp__global ul.sp__language > li > a {
    line-height: 100%;
    padding: 12px 25px;
    border: 1px solid #003973;
    color: #a4a4a4;
}
#sp__global ul.sp__language > li:first-child > a {
    border-right: none;
}
#sp__global ul.sp__language > li.active > a {
    background-color: #003973;
    color: white;
    font-weight: bold;
}
/*mainブロック設定
---------------------------------------------------------------------------*/
/*mainブロックの設定*/
body main {
	padding:0px 0px 0px 0px; /*上、右、下、左へのボックス内の余白*/
}

/*h2タグのbefor（下線のデフォルトの状態の設定）*/
main h2::before {
	background: #d9d9d9;	/*線となる背景の色*/
}

/*h2タグのbefor,after 共通設定*/
main h2::before ,main h2::after {
	/* content: ""; */
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 3px;	/*ラインの高さ*/
}

/*h2タグのafter（アニメーションの初期設定）*/
main h2::after {
	background: #3551de;		/*線となる背景の色*/
	transition: 1s 0.5s;		/*1sはアニメーションの実行時間は1秒。0.5秒遅れてスタートする指定。*/
	transform: scaleX(0);		/*幅。最初は0にして見えなくしておく。*/
	transform-origin: left top;	/*線の出現起点が左からになるように。中央からの出現がよければこの１行削除。*/
}

/*h2タグのアニメーション結果。ライン幅が100%になる。*/
main h2.linestyle::after {
	transform: scaleX(1);
}

/*mainブロックのh3タグ*/
main h3 {
	padding: 5px;	/*ボックス内の余白*/
	margin-bottom: 30px;	/*下に空けるスペース*/
	letter-spacing: 0.1em;	/*文字間隔を少しだけ広くとる設定*/
	border-bottom: 1px solid #ccc;	/*下線の幅、線種、色*/
}

/*mainブロックのpタグ*/
main p {
	margin: 0 5px 30px;	/*上、左右、下へ空けるスペース*/
}

/*listボックスを囲むボックス*/
.list-container {
	display: flex;		/*flexボックスを使う指定*/
	flex-wrap: wrap;	/*折り返す指定*/
	justify-content: space-between;	/*並びかたの種類の指定*/
	padding: 0 5px;		/*上下、左右へのボックス内の余白*/
}

/*１個あたりのボックス*/
.list {
	width: 49%;				/*ボックスの幅*/
	margin-bottom: 15px;	/*ボックス同士の上下間の余白*/
	padding: 10px;			/*ボックス内の余白*/
	position: relative;
	overflow: hidden;
	transition: 0.3s;		/*アニメーションにかける時間。0.3秒。*/
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅。0,0,0は黒の事で0.2は色が20%ついた状態。*/
	background: #fff;	/*背景色*/
}

/*マウスオン時にボックスの影を少し濃くする*/
.list:hover {
	box-shadow: 0px 0px 15px rgba(0,0,0,0.5);
}

/*リンクテキスト*/
.list a {
	text-decoration: none;
	color: #333;	/*文字色*/
}

/*ボックス内のh4タグ*/
.list h4 {
	line-height: 1.5;	/*行間を少し狭くする*/
	color: #3551de;		/*文字色*/
	margin: 5px 0;		/*上下、左右に空けるスペース*/
}

/*ボックス内のpタグ。指定した行数までを表示。*/
.list p {
	margin: 0!important;	/*「main p」のマージンをリセットする*/
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;	/*表示させたい行数。変更する際は、下の「IE対策」の「height」も変更して下さい。*/
	font-size: 0.7rem;		/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
    line-height: 1.5em;		/*IE対策。行間。１行あたりの高さの事。1.5文字分。*/
    max-height: 4.5em;		/*IE対策。最大の高さ。1.5emの3倍の4.5emになっているので、3行分という事。*/
}

/*NEW,UPアイコン
---------------------------------------------------------------------------*/
/*NEW,UPアイコン 共通*/
.newicon, .upicon {
	display: inline-block;
	text-align: center;
	padding: 0 5px;
	border-radius: 3px;
	transform: scale(0.7);
}

/*newiconへの追加指定。*/
.newicon {
	background: #f00;		/*背景色*/
	color: #fff;			/*文字色*/
}

/*upiconへの追加指定。*/
.upicon {
	background: #257dce;	/*背景色*/
	color: #fff;			/*文字色*/
}

/*option帯リボン
---------------------------------------------------------------------------*/
/*option1,option2 共通*/
.option1, .option2 {
	font-size: 0.7rem;	/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
	display: inline-block;
	width: 200px;
	text-align: center;
	position: absolute;
	top: 0px;
	left: 0px;
	transform: translate(-60px, 20px) rotate(-30deg);	/*translateは配置場所の指定。rotateは回転。*/
	box-shadow: 0px 3px 2px rgba(0,0,0,0.2);			/*影*/
}

/*h2タグ内で使った場合のoption1,option2 共通（※CMS用）*/
h2 .option1, h2 .option2 {
	width: auto;
	position: relative;
	transform: translate(0px, -4px) rotate(0deg);
	padding: 5px 20px;
	margin-left: 10px;
}

/*option1への追加指定。*/
.option1 {
	background: #ff0000;	/*背景色*/
	color: #fff;			/*文字色*/
}

/*option2への追加指定。*/
.option2 {
	background: #ccc;		/*背景色*/
	color: #888;			/*文字色*/
}

/*フッターメニュー設定
---------------------------------------------------------------------------*/
/*ボックス全体の設定*/
#footermenu {
	background: #212121;	/*背景色*/
	color: #999;		/*文字色*/
	font-size: 0.7rem;	/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
	padding: 0px;	/*上下、左右へのボックス内の余白*/
}
#footermenu > .f-container{
	padding: 70px 0px 30px 0px;
	max-width: 1160px;
	margin: 0px auto;
}
/*左側メニュー設定*/
#footermenu > .f-container > .left-menu {
	max-width: 240px;
	min-width: 240px;
}
/*右側メニューの入れ物の設定*/
#footermenu > .f-container > ul:not([class]) {
	width: calc(100% - 240px);
	padding-left: 80px;
	color: #DDDDDD;
}
/*右側メニューのFlex設定*/
#footermenu > .f-container > ul:not([class]) .Flex {
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
/*右側メニュー内の各リストの設定*/
#footermenu > .f-container > ul:not([class]) .Flex > ul{
	width: calc(33.3333% - 30px);
}
/*各リストの項目設定*/
#footermenu > .f-container > ul:not([class]) .Flex > ul > li > a{
	display: block;
	position: relative;
	padding: 18px 19px;
	font-size: 15px;
	font-weight: bold;
	line-height: 120%;
	border-bottom: 1px solid #494949;
	color: #DDDDDD;
	transition: opacity 0.2s ease-in-out;
}
/*各リスト項目のアイコン設定*/
#footermenu > .f-container > ul:not([class]) .Flex > ul > li > a:before {
    position: absolute;
    font-family: 'Material Icons';
	font-weight: 100;
	font-size: 11px;
    content: "\e5e1";
	left: 0px;
	top: 50%;
	transform: translateY(-50%);
}
/*各リストの項目ホバー時設定*/
#footermenu > .f-container > ul:not([class]) .Flex > ul > li > a:hover {
	opacity: 0.7;
}
/*左側メニューのSNSボタン*/
#footermenu .left-menu .facebook,
#footermenu .left-menu .youtube {
	display: inline-block;
	position: relative;
	width: 36px;
	height: 36px;
	background-color: #3B3B3B;
	margin: 30px 7px 30px 0px;
	transition: opacity 0.2s ease-in-out;
}
/*SNSボタンホバー*/
#footermenu .left-menu .facebook:hover,
#footermenu .left-menu .youtube:hover {
	opacity: 0.7;
}
/*SNSボタンのアイコン*/
#footermenu .left-menu .facebook::before,
#footermenu .left-menu .youtube::before {
	position: absolute;
	font-family: "Font Awesome 5 Brands";	/*Font Awesomeを使う指定*/
	color: white;
	font-size: 26px;
	font-weight: 100;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
#footermenu .left-menu .facebook::before {
	content: "\f39e";
}
#footermenu .left-menu .youtube::before {
	content: "\f167";
}
/*左側メニューの通常ボタン*/
#footermenu .left-menu .f-button {
	display: block;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	line-height: 120%;
	letter-spacing: 0.1em;
	padding: 16px 5px;
	position: relative;
	color: #DDD;
	background-color: #3B3B3B;
	margin-bottom: 13px;
	transition: opacity 0.2s ease-in-out;
}
/*左側メニューの通常ボタンホバー*/
#footermenu .left-menu .f-button:hover {
	opacity: 0.7;
}
/*左側メニューの通常ボタンアイコン*/
#footermenu .left-menu .f-button:after {
	position: absolute;
    font-family: 'Material Icons';
	font-weight: 600;
	font-size: 11px;
    content: "\e5e1";
	top: 50%;
	right: 7px;
	transform: translateY(-50%);
}
/*ボックス内のリンクテキスト設定*/
#footermenu a {
	text-decoration: none;
	color: #ddd;	/*文字色*/
}

/*リンクテキストのマウスオン時*/
#footermenu a:hover {
	color: white;	/*文字色*/
}

/*ulタグ（列単位）*/
#footermenu ul {
	margin: 0;
	list-style: none;
	/*align-self: center;	フッターメニューをブロックの上下中央に配置する。上によせたいならこの１行削除。*/
}

/*title*/
#footermenu .title {
	font-weight: bold;
    padding-bottom: 0px;
    margin-bottom: 10px;
    font-size: 26px;
    line-height: 120%;
	color: #ddd;
}

/*フッター右側の装飾画像*/
#footermenu .kazari {
	display: none;	/*スペースが狭いので飾りを非表示にしておく*/
}


/*フッター設定
---------------------------------------------------------------------------*/
footer small {font-size: 100%;}

footer {
	font-size: 0.6rem;		/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
	background: #212121;	/*背景色*/
	color: #fff;			/*文字色*/
	text-align: left;		/*内容をセンタリング*/
	padding: 20px;			/*ボックス内の余白*/
	border-top: 1px solid #494949;
}

/*コンテナー*/
.footerContainer {
	max-width: 1120px;
	width: 100%;
	margin: 0px auto;
}

/*リンクテキスト*/
footer a {color: #fff;text-decoration: none;}

/*リンクテキストのマウスオン時*/
footer a:hover {color: #fff;}

/*著作部分*/
footer span {
    font-size: 14px;
    color: #DDDDDD;
	display: block;
}
footer .pr {display: block;}

/*フッター新デザイン用追加設定
---------------------------------------------------------------------------*/
div#footermenu nav > .Flex:not(:last-child) {
    padding-bottom: 60px;
}
div#footermenu nav > .Flex:not(:first-child){
    padding-top: 30px;
    border-top: 1px solid #777777; 
}
div#footermenu nav .Flex > ul {
    width: 20%;
    padding-right:40px;
    line-height: 110%;
}
div#footermenu nav .Flex > ul > li > a {
    font-weight: bold;
    margin-bottom: 15px;
    display: inline-block;
}
div#footermenu nav .Flex > ul > li > ul {
    padding-top: 24px;
    position: relative;

}
div#footermenu nav .Flex > ul > li > ul:before {
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    width: 42px;
    height: 1px;
    background-color: #777777;
}
div#footermenu nav .Flex > ul > li > ul a {
    font-size: 13px;
    color: #bdbdbd;
    margin-bottom: 7px;
    display: inline-block;
}
div#footermenu nav .Flex > ul > li > ul a:hover {
    color: white;
}
div#footermenu nav .Flex > ul > li > ul > li > ul > li > a {
    position: relative;
    padding-left: 1em;
}
div#footermenu nav .Flex > ul > li > ul > li > ul > li > a:before {
    position: relative;
    content: "-";
    margin-right: 0.5em;
    margin-left: -1em;
    height: 100%;
}
#footermenu > .f-container {
    padding: 40px 0px 0px 0px;
}
.f-container .fullWidth > li {
    width: 80%;
    margin: 0px auto;
}
.f-container .fullWidth > li > a{
    display: block;
    width: 100%;
    line-height: 100%;
    padding: 15px 0px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-bottom: 1px solid #777777;
    position: relative;
}
.f-container .fullWidth > li > a:hover {
    background-color: rgba(255,255,255,0.1);
}
.f-container .fullWidth > li > a:after {
    position: absolute;
    font-family: "Material Icons";
    content: "\e5cc";
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 24px;
}
div#footermenu nav.sp-only > .Flex {
    border:none;
    margin-top: 25px;
    padding-bottom: 0px;
}
.f-container .halfWidth.Flex > li {
    width: 50%;
    border: 1px solid #777777;
    border-bottom: none;
    line-height: 100%;
}
.f-container .halfWidth.Flex > li {
    border-right: none;
}
.f-container .halfWidth.Flex > li:nth-of-type(odd) {
    border-left: none;
}
.f-container .halfWidth.Flex > li:last-child,
.f-container .halfWidth.Flex > li:nth-last-of-type(2) {
    border-bottom: 1px solid #777777;
}
.f-container .halfWidth.Flex > li > a {
    line-height: 130%;
    display: block;
    padding: 15px 25px;
    font-size: 14px;
    font-weight: bold;
}
.f-container .halfWidth.Flex > li > a:hover {
    background-color: rgba(255,255,255,0.1);
}
.f-container .inlineBlock {
    font-size: 0px;
    padding: 30px 25px 10px 25px;
}
.f-container .inlineBlock > li {
    font-size: 13px;
    font-weight: bold;
    line-height: 100%;
    display: inline-block;
    padding-right: 15px;
    margin-right: 15px;
    margin-bottom: 20px;
    position: relative;
}
.f-container .inlineBlock > li:after {
    position: absolute;
    content: "";
    width: 1px;
    height: 1em;
    background-color: white;
    right: 0px;
    top: 50%;
    transform: translateY(-50%) rotate(25deg);
}
footer .footerContainer {
    max-width: 1160px;
}
.footerContainer .Flex {
    -webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
/*最下部コンテンツ*/
.sns.Flex {
    margin: 0px 25px;
}
.sns.Flex > a {
    display: inline-block;
    font-size: 26px;
    background-color: #3b3b3b;
    line-height: 100%;
    padding: 5px;
    margin: 10px 0px;
}
.sns.Flex > a:nth-of-type(2) {
    margin: 5px 8px;
}
.copyright > span {
    letter-spacing: 1px;
    color: #c6c6c6;
}
.sns.Flex > a > .fa-youtube {
    color: #dddddd;
}
.sns.Flex > a > .fa-twitter {
    color: #858585;
}
.sns.Flex > a > .fa-facebook {
    color: #848484;
    position: relative;
}
.sns.Flex > a > .fa-facebook:before {
    position: relative;
    z-index: 1;
}
.sns.Flex > a > .fa-facebook:after {
    position: absolute;
    content: "";
    width: 90%;
    height: 90%;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border-radius: 100%;
    background-color: white;
}
.sns.Flex > a:hover > i {
    color: white;
}
.sns.Flex > a:hover > .fa-facebook {
    color: #9f9f9f;
}

/*テーブル
---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.ta1 caption {
	border-top: 1px solid #ccc;	/*上の枠線の幅、線種、色*/
	font-weight: bold;			/*太字に*/
	padding: 10px 5px;			/*上下、左右へのボックス内の余白。基本的に数行下の「.ta1 th, .ta1 td」のpaddingと揃えておけばOKです。*/
	background: #fafafa;		/*背景色*/
}

/*ta1テーブルブロック設定*/
.ta1 {
	border-top: 1px solid #ccc;	/*テーブルの一番上の線。幅、線種、色*/
	table-layout: fixed;
	width: calc(100% - 10px);	/*テーブルの両サイドに合計10px（左右各5pxずつ）の余白を作った残りを幅にします*/
	margin: 0 auto 30px;		/*最後の「30px」がテーブルの下に空けるスペースです*/
}

/*tr（１行分）タグ設定*/
.ta1 tr {
	border-bottom: 1px solid #ccc;	/*テーブルの下線。幅、線種、色*/
}

/*th（左側）、td（右側）の共通設定*/
.ta1 th, .ta1 td {
	padding: 10px 5px;		/*上下、左右へのボックス内の余白*。基本的に数行上の「.ta1 caption」のpaddingと揃えておけばOKです。*/
	word-break: break-all;	/*英語などのテキストを改行で自動的に折り返す設定。これがないと、テーブルを突き抜けて表示される場合があります。*/
}

/*th（左側）のみの設定*/
.ta1 th {
	width: 30%;			/*幅*/
	text-align: left;	/*左よせにする*/
}

/*よく頂く質問
---------------------------------------------------------------------------*/
.faq {
	padding: 0 5px;	/*上下、左右へのボックス内の余白*/
}
/*質問*/
.faq dt {
	border-radius: 10px;	/*枠を角丸にする指定*/
	margin-bottom: 20px;	/*下に空けるスペース*/
	background: linear-gradient(#fff, #f7f7f7);	/*背景グラデーション*/
	box-shadow: 0px 0px 5px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅、0,0,0は黒の事で0.2は色が20%出た状態の事。*/
	text-indent: -54px;				/*テキストのインデント。Qアイコンだけ左に飛び出るようにする指定。下のpaddingの一番最後の数字と合わせて下さい。※マイナスは取らないで。*/
	padding: 20px 20px 20px 54px;	/*上、右、下、左への余白。最後の数字と上のtext-indentの数字と揃えておく。text-indentは必ずマイナスをつけた状態で。*/
}
/*アイコン（Font Awesome）*/
.faq dt::before {
	font-family: "Font Awesome 5 Free";	/*Font Awesomeを使う指定*/
	content: "\f059";	/*使いたいアイコン名をここで指定。Font Awesomeに記載されています。詳しくは当テンプレートのマニュアルを読んで下さい。*/
	color: #3551de;		/*アイコンの色*/
	padding: 0 20px;	/*上下、左右への余白*/
}

/*回答*/
.faq dd {
	padding: 0 40px 30px;	/*上、左右、下への余白*/
}

/*opencloseを適用した要素のカーソル*/
.openclose {
	cursor: pointer;	/*カーソルの形状。リンクと同じスタイルにしてクリックできると認識してもらう。*/
}


/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
.pagetop-show {display: block;}

.pagetop a {
	display: block;text-decoration: none;text-align: center;
	width: 50px;		/*幅*/
	line-height: 50px;	/*高さ*/
	position: fixed;
	right: 30px;		/*右からの配置場所指定*/
	bottom: 30px;		/*下からの配置場所指定*/
	color: #fff;		/*文字色*/
	background: rgba(0,0,0,0.4);	/*背景色。0,0,0は黒色の指定で0.4は色が40%出た状態。*/
	/* border: 1px solid #fff; */	/*枠線の幅、線種、色*/
    border-radius: 25px;
    z-index: 999;
}

/*マウスオン時*/
.pagetop a:hover {
	background: rgba(0,0,0,0.8);	/*背景色。0,0,0は黒色の指定で0.8は色が80%出た状態。*/
}

/*btnの設定
---------------------------------------------------------------------------*/
/*ボタンを囲むブロック*/
.btn {
	text-align: center;	/*内容をセンタリング*/
	font-size: 1.2rem;	/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
}

/*ボタン*/
.btn a,
.btn input {
	display: inline-block;text-decoration: none;border: none;
	background: #3551de;	/*背景色*/
	color: #fff;			/*文字色*/
	border-radius: 5px;		/*角丸のサイズ。ほんの少しだけ角が丸くなります。*/
	padding: 5px 10px;		/*上下、左右へのボタン内の余白*/
	box-shadow: 2px 2px 4px rgba(0,0,0,0.2);	/*ボックスの影。右へ、下へ、ぼかし幅。0,0,0は黒のことで0.2は色が20%ついた状態。*/
}

/*右側の矢印アイコン（アイコンにはFont Awesomeを使用）*/
.btn i {
	padding-left: 10px;		/*アイコンとテキストの間に空ける余白*/
	transform: scale(1.5);	/*アイコン画像を1.5倍にする*/
}

/*ボタンのマウスオン時*/
.btn a:hover,
.btn input:hover {
	opacity: 0.9;	/*透明度。0.9は色が90%ついた状態のこと。*/
}

/*詳細ページの画像切り替え（imgchg_pack.js）※一般のhtmlテンプレートで利用。
---------------------------------------------------------------------------*/
/*大きな画像のボックスと説明文を入れるボックス*/
#item-image {
	position: relative;
	margin: 0 auto 20px;
	text-align: center;
	width: 100%;
}

/*大きな画像の１行目*/
#item-image #item_image1 {
	z-index: 2;
	position: relative;
	overflow: hidden;
}

/*大きな画像の２行目*/
#item-image #item_image2 {
	z-index: 1;
	position: absolute;
	left: 0px;
	top: 0px;
	overflow: hidden;
}

/*大きな画像のボックスの中の画像*/
#item-image img {
	width: 100%;
}

/*サムネイル画像*/
.thumbnail {
	width: 80px;	/*画像の幅*/
	border: 1px solid #dcdcdc;	/*枠線の幅、線種、色*/
	margin-bottom: 5px;
}

.thumbnail:hover {
	border: 1px solid #999;	/*マウスオン時の枠線の幅、線種、色*/
}

/*こだわりアイコンブロックの設定（※CMS用）
---------------------------------------------------------------------------*/
.specialbox {
	display: inline-block;
}
.specialbox img {
	padding: 2px 0;;
}

/*パノラマ画像のサイズ設定（※CMS用）
---------------------------------------------------------------------------*/
.panorama-img {
	width: 100% !important;
	height: 200px !important;
}

/*テーマカラーの背景色の「注目物件」ボックス
---------------------------------------------------------------------------*/
/*ボックスの設定*/
.bg1 {
	background: #3551de;	/*ボックスの背景色*/
	padding: 12px;			/*ボックス内の余白*/
	border-radius: 5px;		/*ほんの少し角を丸くする指定*/
	color: #fff;			/*文字色*/
}

/*ボックス内のリンクテキスト*/
.bg1 > a {
	color: #fff;			/*文字色*/
}

/*ボックス内のh2タグ*/
.bg1 h2 {
	text-align: center;		/*テキストをセンタリング*/
	margin: 0 !important;
}

/*ボックス内のh2タグのbefor（下線のデフォルトの状態の設定）*/
.bg1 h2::before {
	background: transparent;		/*線となる背景の色。transparentは透明の事。*/
}

/*ボックス内のh2タグのafter（アニメーションの初期設定）*/
.bg1 h2::after {
	background: #fff;				/*線となる背景の色*/
	transform-origin: center top;	/*線の出現起点が中央からになるように。*/
}
/*メインスライド
---------------------------------------------------------------------------*/
#MainSlider{
    overflow: hidden;
}
[class^="MS-Slide"] .slide-image {
    height: 650px;
    background-position: 50% center;
    background-repeat: no-repeat;
    background-size: cover;
}
#MainSlider .slick-active .slide-image{
    animation  : bgAnime 5.5s ease-out;
}
@keyframes bgAnime {
    0% { opacity: 1; transform: scale(1.08, 1.08); }
    100% { opacity: 1; transform: scale(1.0, 1.0); }
}
div#MS-Slide__PrevArrow:after,
div#MS-Slide__NextArrow:after {
    background-color: #222222;
    border-radius: 0px;
}
div#MS-Slide__PrevArrow {
    left: 0px;
}
div#MS-Slide__NextArrow {
    right: 0px;
}
#MainSlider .slick-dots {
    bottom: 25px;
}
#MainSlider .slick-dots > li {
    width: 100px;
}
#MainSlider .slick-dots button {
    border-radius: 0px;
    width: 100%;
    height: 4px;
    background-color: #afafaf;
}
#MainSlider .slick-dots .slick-active button {
    background-color: #22adc6;
}

/*セクションやコンテナー
---------------------------------------------------------------------------*/
#InfoSection {
	background: linear-gradient(to bottom, #C0C0CD, #FFF 50%);
}
#FeaturesSection,
#InfoSection {
	padding: 120px 20px 120px 20px; 
}
#PressReleaseSection {
	padding: 0px 20px 20px 20px;
}
#GakumuNewsSection {
	padding: 0px 20px 80px 20px;
}
#DepartmentsSection {
    padding: 90px 20px;
}
.GakumuNewsContainer,
.PressReleaseContainer,
.FeaturesContainer,
.InfoContainer {
	max-width: 1360px;
	background-color: white;
	margin: 0px auto;
}
.DepartmentsContainer {
    max-width: 1360px;
    margin: 0px auto;
}
main .GakumuNewsWrap {
	padding: 0px 90px 0px 90px;
}
main .DepartmentsWrap {
    padding: 0px 90px;
}
main .PressReleaseWrap,
main .FeaturesWrap,
main .InfoWrap {
    padding: 80px 90px 0px 90px;
}

/*お知らせコーナー
---------------------------------------------------------------------------*/
.News {
    width: calc(100% - 300px);
    padding-right: 90px;
}
.News h1 {
    font-size: 34px;
    font-weight: normal;
    color: #003973;
    padding-bottom: 30px;
    border-bottom: 2px solid #003973;
}
.News > .Flex {
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
    -ms-flex-wrap: nowrap;
  	flex-wrap: nowrap;
}
.News .Post {
    margin: 10px 0px;
    padding-bottom: 10px;
    border-bottom: 2px solid #f4f4f6;
}
.News .Post:last-of-type {
    margin-bottom: 0px;
}
.News .Thumbnail {
    width: 60px;
    height: 60px;
    min-width: 60px;
    min-height: 60px;
    position: relative;
    margin-right: 15px;
}
.News .Thumbnail img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
/*
    min-width: 100%;
    min-height: 100%;
*/
    max-width: 100%;
    max-height: 100%;
}
.News > .Flex > .Flex > .Flex,
.News > .Flex > .Flex {
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.News .Publish {
    font-size: 15px;
	width: 80px;
	margin-right: 11px;
}
.News .Category {
    font-size: 12px;
    font-weight: bold;
    line-height: 100%;
    letter-spacing: -0.5px;
    color: #2481c5;
    border: 1px solid #2481c5;
    border-radius: 3px;
    padding: 3px 0px;
	width: 75px;
	text-align: center;
    margin-right: 15px;
}
.News .Category.other {
    color: #003973;
    border: 1px solid #003973;
}
.News .Category.news {
    color: #f8bc04;
    border: 1px solid #f8bc04;
}
.News .Post > .Flex > a {
    text-decoration: none;
}
.News .Post > .Flex > a > h2 {
    font-size: 16px;
    font-weight: 500;
    line-height: 130%;
}


/*イベントコーナー
---------------------------------------------------------------------------*/
article.Events {
    width: 300px;
}
.Events h1 {
    font-size: 34px;
    font-weight: normal;
    color: #003973;
    padding-bottom: 30px;
}
div#EventsSlider {
    padding-top: 12px;
}
div#EventsSlider .slick-dots {
    top: 0px;
    bottom: auto;
}
div#EventsSlider .slick-dots li {
    width: 32.33333%;
    margin: 0px;
}
div#EventsSlider .slick-dots li:nth-of-type(2) {
    margin: 0px 1.5%;
}
div#EventsSlider .slick-dots li button {
    border-radius: 0px;
    height: 2px;
    width: 100%;
    background-color: #dddddd;
}
div#EventsSlider .slick-dots li.slick-active button {
    background-color: #217fc4;
}
#ES-Slide__NextArrow,
#ES-Slide__PrevArrow {
    top: -90px;
    transform: none;
}
#ES-Slide__PrevArrow {
    right: 58px;
    left: auto;
}
#ES-Slide__NextArrow:after,
#ES-Slide__PrevArrow:after {
    content: "\e941";
    color: #afafaf;
    background-color: white;
    border: 1px solid #afafaf;
    transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}
#ES-Slide__NextArrow.active:after,
#ES-Slide__PrevArrow.active:after,
#ES-Slide__NextArrow:hover:after,
#ES-Slide__PrevArrow:hover:after {
    color: #2e87c7;
    border-color: #2e87c7;
}
#ES-Slide__NextArrow:after {
    transform: rotate(0deg);
    padding-top:12px;
    padding-bottom:8px;
}
#ES-Slide__PrevArrow:after {
    transform: rotate(180deg);
}
.ES-Publish {
    font-size: 14px;
    margin-top: 20px;
    margin-bottom: 5px;
    padding: 0px 20px;
    line-height: 100%;
}
.ES-Title a {
    text-decoration: none;
}
.ES-Title a h2 {
    font-size: 16px;
    font-weight: 500;
    padding: 0px 20px;
    line-height: 130%;
    padding-bottom: 40px;
    border-bottom: 1px solid #777777;
}


/*MOREボタン
---------------------------------------------------------------------------*/
a.MoreButton {
    position: relative;
    display: block;
    width: 100%;
    padding: 80px 0px 40px 0px;
    text-align: center;
    text-decoration: none;
    line-height: 150%;
    transition: background-color 0.2s ease-in-out;
}
a.MoreButton:after {
    position: absolute;
    content: "";
    width: 0%;
    height: 1px;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #CCCCCC;
    transition: width 0.2s ease-in-out;
}
.MoreIcon {
    position: relative;
}
.MoreIcon:before,
.MoreIcon:after {
    position: absolute;
    content: "";
    width: 37px;
    height: 2px;
    background-color: #217fc4;
    left: 50%;
    top:-20px;
    transform: translateX(-50%);
    transition: background-color 0.2s ease-in-out;
}
.MoreIcon:after {
    transform: translateX(-50%) rotate(90deg);   
}
.MoreButton span {
    font-size: 12px;
    color: #217fc4;
    transition: color 0.2s ease-in-out;
}
a.MoreButton:hover {
    background-color: #f3f3f3;
}
a.MoreButton:hover:after {
    width: 100%;
}
a.MoreButton:hover .MoreIcon:before,
a.MoreButton:hover .MoreIcon:after {
    background-color: #8ab9db;
}
a.MoreButton:hover span {
    color: #8ab9db;
}


/*MEDIAコーナー
---------------------------------------------------------------------------*/
/*タイトルと概要テキスト*/
.FeaturesWrap > h2 ,
.FeaturesWrap > p {
	text-align: center;
}
.FeaturesWrap > h2 {
	font-size: 34px;
	font-weight: normal;
	line-height: 120%;
	letter-spacing: 0px;
	color: #003973;
}
.FeaturesWrap > p {
	font-size: 14px;
	line-height: 140%;
	letter-spacing: 1px;
	color: #212121;
	margin: 35px 0px 50px 0px;
}
section#FeaturesSection {
    padding-top: 60px;
    padding-bottom: 20px;
    background-color: #f4f4f6;
}
main .FeaturesContainer {
    background-color: inherit;
}
a.MoreButton:hover {
    background-color: white;
}
article#FeaturesArticle.Flex {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
#FeaturesArticle > article {
    border-bottom: 1px solid #CCCCCC;
    padding-bottom: 0px;
    background-color: white;
    width: 23.5%;
}
#FeaturesArticle > article:last-of-type {
    margin-right: 0px;
}
.FeaturesPost > a{
    display: block;
    height: 100%;
    text-decoration: none;
}
.FeaturesPost .Thumbnail {
    position: relative;
    width: 100%;
    height: 200px;
    overflow: hidden;
}
.FeaturesPost .Thumbnail img {
    position: absolute;
/*
    max-width: none;
    max-height: none;
    min-width: 100%;
    min-height: 100%;
    height: 100%;
*/
    max-width: 100%;
    max-height: 100%;
    top: 0%;
	bottom: 0;
	margin-top: auto;
	margin-bottom: auto;
    left: 50%;
    transform: translate(-50%,0%);
    transition: transform 0.2s ease-in-out;
}
@media screen and (max-width:1189px){
    .FeaturesPost .Thumbnail img {
        height: auto;
/*        width: 100%;*/
    }
}
.FeaturesPost > a:hover .Thumbnail img {
    transform: translate(-50%, 0%) scale(1.1,1.1);
}
.FeaturesPost .Meta {
    line-height: 100%;
    margin-top:30px;
    padding: 0px 10px;
}
.FeaturesPost .Category {
    font-size: 13px;
    font-weight: bold;
    width: 120px;
    display: inline-block;
    border: 1px solid;
    text-align: center;
    padding: 2px 0px 1px 0px;
    border-radius: 3px;
    line-height: 100%;
    margin-top:-3px;
}
.FeaturesPost .Category.rigakubu-news {
    border-color: #fdb914;
    color: #fdb914;
}
.FeaturesPost .Category.youtube {
    border-color: #ec403a;
    color: #ec403a;
}
.FeaturesPost .Category.rigakubu-column {
    border-color: #023b74;
    color: #023b74;
}
.FeaturesPost .Publish {
    font-size: 13px;
    margin-left: 3%;
}
.FeaturesPost .Title h2 {
    font-size: 15px;
    font-weight: 500;
    padding: 0px 10px 40px 10px;
    line-height: 150%;
    margin-top: 30px;
}

/*MEDIAコーナー内のRIGAKU-RU
---------------------------------------------------------------------------*/
#FeaturesArticle > .RIGAKU-RU {
    background-color: #e0dddc;
}
.RIGAKU-RU__Title {
    text-align: center;
}
.RIGAKU-RU__Title h2 {
    font-size: 16px;
    line-height: 100%;
    margin-top: 30px;
}
.RIGAKU-RU__Img {
    width: 195px;
    margin: 15px auto 0px auto;
}
.RIGAKU-RU__SubTitle h3 {
    line-height: 100%;
    font-size: 15px;
    border-bottom: none;
    padding: 0px 25px;
    margin-top: 20px;
    margin-bottom: 20px;
    color: #222222;
    letter-spacing: 0.5px
}
.RIGAKU-RU__Text {
    line-height: 160%;
    font-size: 13px;
    padding: 0px 30px;
    margin: 0px;
    color: #484848;
}
.RIGAKU-RU__Readmore {
    padding: 20px 32px;
}
.RIGAKU-RU__Readmore a {
    display: block;
    width: 100%;
    background-color: #1d120f;
    color: white;
    text-decoration: none;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    line-height: 100%;
    padding: 18px 0px 18px 0px;
    border-radius: 3px;
    border:1px solid #1d120f;
    position: relative;
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}
.RIGAKU-RU__Readmore a span {
    position: relative;
    padding-left: 35px;
}
.RIGAKU-RU__Readmore a span:before, .RIGAKU-RU__Readmore a span:after {
    position: absolute;
    content: "";
    transition: left 0.2s ease-in-out, border-color 0.2s ease-in-out;
}
.RIGAKU-RU__Readmore a span:before {
    width: 6px;
    height: 6px;
    left: 8px;
    top: 50%;
    border-top: 1px solid white;
    border-right: 1px solid white;
    transform: translateY(-50%) rotate(45deg);
}
.RIGAKU-RU__Readmore a span:after {
    width: 25px;
    height: 25px;
    left: 0px;
    top: 50%;
    border: 1px solid white;
    border-radius: 100%;
    transform: translateY(-50%);
}
.RIGAKU-RU__Readmore a:hover {
    background-color: white;
    color: #1d120f;
}
.RIGAKU-RU__Readmore a:hover span:before {
    left: 13px;
    border-color: #1d120f;
}
.RIGAKU-RU__Readmore a:hover span:after {
    left: 5px;
    border-color: #1d120f;
}

/*プレスリリーススライドコーナー
---------------------------------------------------------------------------*/
.PressRelease h1 {
    font-size: 42px;
    font-weight: bold;
    color: #003973;
    text-align: center;
}
.PressRelease h1 > span {
    position: relative;
}
.PressRelease h1 > span:before {
    position: relative;
    content: url(https://www-images.s.u-tokyo.ac.jp/ja/images/icon-1.png);
    vertical-align: middle;
    top: 9px;
    margin-right: 20px;
}
#PR-Slider {
    padding-top: 100px;
}
#PR-Slider .slick-prev,
#PR-Slider .slick-next {
    top: 23px;
    right: 0px;
    left: auto;
    transform: none;
}
#PR-Slider .slick-prev {
    right: 55px;
}
#PR-Slider .slick-prev::after,
#PR-Slider .slick-next::after {
    content: "\e941";
    color: #afafaf;
    background-color: white;
    border: 1px solid #afafaf;
    transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}
#PR-Slider .slick-prev::after {
    transform: rotate(180deg);
}
#PR-Slider .slick-next::after {
    transform: none;
}
#PR-Slider .slick-prev.active:after,
#PR-Slider .slick-next.active:after,
#PR-Slider .slick-prev:hover:after,
#PR-Slider .slick-next:hover:after {
    color: #2e87c7;
    border-color: #2e87c7;
}
#PR-Slider .slick-dots {
    top: 45px;
    bottom: auto;
    line-height: 0%;
    width: 300px;
    left: 50%;
    transform: translateX(-50%);
}
#PR-Slider .slick-dots li {
    position: relative;
    width: 31.3333%;
    margin: 0px;
}
#PR-Slider .slick-dots > li:nth-of-type(2) {
    margin: 0px 3%;
}
#PR-Slider .slick-dots li button {
    border-radius: 0px;
    width: 100%;
    height: 2px;
    background-color: #dddddd;
}
#PR-Slider .slick-dots li.slick-active button {
    background-color: #217fc4;
}
/*プレスリリーススライド本体
---------------------------------------------------------------------------*/
[class^="PR-Slide"] > .Flex {
    -webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
    padding: 10px 10px;
}
.PR-Post {
    width: 31%;
    background-color: #003973;
    filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
}
.PR-Image {
    width: 100%;
    height: 225px;
    position: relative;
    overflow: hidden;
	border-bottom: 1px solid #cccccc;
}
.PR-Image img {
/*
    min-width: 100%;
    min-height: 100%;
    max-width: none;
    max-height: none;
*/
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
    transition: transform 0.2s ease-in-out;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
}
.PR-Post > a {
    text-decoration: none;
}
.PR-Post > a:hover .PR-Image img {
    transform: translateX(-50%) scale(1.1,1.1);
}
.PR-Publish {
    position: relative;
}
.PR-Publish:after {
    position: absolute;
    content: "";
    width: 100px;
    height: 5px;
    top: 0px;
    left: 0px;
    background-color: #003973;
}
.PR-Publish {
    line-height: 100%;
    padding: 25px 20px 10px 20px;
    font-size: 15px;
    /* margin-top: 5px; */
}
.PR-Title h2 {
    line-height: 140%;
    padding: 0px 20px 50px 20px;
    font-size: 16px;
    font-weight: 500;
    color: #222222;
    letter-spacing: 0.1px;
}
.PR-Post > a:hover .PR-Title h2 {
    color: inherit;
}


/*学務からのお知らせ
---------------------------------------------------------------------------*/
.GakumuNews {
    background-color: #ebf4fc;
    padding: 40px 0px;
}
.GakumuNews > h1 {
    text-align: center;
    font-size:22px;
    color: #003973;
    letter-spacing: 3px;
    line-height: 130%;
    margin-bottom: 19px;
}
#GN-Slider,
#GN-Slider__SP {
    width: calc(100% - 200px);
    padding: 0px 160px;
}
.GN-Image {
    width: 110px;
    height: 110px;
    overflow: hidden;
    position: relative;
}
.GN-Image img {
    position: absolute;
/*
    min-width: 100%;
    min-height: 100%;
    max-width: none;
    max-height: none;
*/
    max-width: 100%;
    max-height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.GN-Container > .MoreButton {
	border-left: 1px solid #CCCCCC;
}
#GN-Slider,
#GN-Slider__SP {
	padding-top: 20px;
}
#GN-Slider a.Flex,
#GN-Slider__SP a.Flex {
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
    text-decoration: none;
}
#GN-Slider a.Flex .GN-Image img,
#GN-Slider__SP a.Flex .GN-Image img {
	transition: transform 0.2s ease-in-out;
}
#GN-Slider a.Flex:hover .GN-Image img,
#GN-Slider__SP a.Flex:hover .GN-Image img {
	transform: translate(-50%,-50%) scale(1.1,1.1);
}
.GN-Texts {
    width: calc(100% - 110px);
    padding-left:25px;
}
.GN-Publish {
    font-size: 15px;
}
.GN-Title h2 {
    font-size: 16px;
    font-weight: 500;
}
#GN-Slider .slick-dots,
#GN-Slider__SP .slick-dots {
	top: 0px;
	bottom: auto;
	left: 100px;
}
#GN-Slider .slick-dots li button,
#GN-Slider__SP .slick-dots li button {
	width: 50px;
	height: 2px;
	border-radius: 0px;
	background-color: #aaaaaa;
}
#GN-Slider .slick-dots li.slick-active button,
#GN-Slider__SP .slick-dots li.slick-active button {
	background-color: #217fc4;
}
#GN-Slide__PrevArrow {
	left: 70px
}
#GN-Slide__NextArrow {
	right: 70px;
}
#GN-Slide__PrevArrow:after,
#GN-Slide__NextArrow:after {
	content: "\e941";
	background-color: #aaaaaa;
	transition: background-color 0.2s ease-in-out;
}
#GN-Slide__PrevArrow.active:after,
#GN-Slide__NextArrow.active:after,
#GN-Slide__PrevArrow:hover:after,
#GN-Slide__NextArrow:hover:after {
	background-color: #217fc4;
}
#GN-Slide__PrevArrow:after {
	transform: rotate(180deg);
}
#GN-Slide__NextArrow:after {
	transform: rotate(0deg);
}

/*専攻紹介
---------------------------------------------------------------------------*/
/*専攻紹介全体の入れ物*/
/*タイトル*/
#Graduate > h2 {
    text-align: center;
    font-size: 60px;
    color: #202020;
    line-height: 130%;
    margin-bottom: 25px;
}
/*概要テキスト*/
#Graduate > p {
    text-align: center;
    font-size: 15px;
    color: #202020;
    line-height: 120%;
    margin: 0px 0px 85px 0px;
}
/*各アイテムの幅や余白*/
#Graduate .GraduateList.Flex > .GL-Item{
    width: 20%;
	padding-bottom: 80px;
	color: white;
}
/*各アイテム内のdivコンテナー*/
#Graduate .GraduateList.Flex > .GL-Item > div {
	padding-left: 15px;
	border-left: 12px solid #003973;
}
/*各アイテムのタイトル*/
#Graduate .GL-Item h2 {
    line-height: 120%;
    padding-top: 20.75%;
    font-size: 2.5vw;
}
/*各アイテムのサブタイトル*/
#Graduate .GL-Item h3 {
    padding: 5px 0px 0px;
    margin-bottom: 34.5%;
    border: none;
    font-size: 1.25vw;
	font-weight: normal;
}
/*各アイテムのMOREボタン*/
#Graduate .GL-Item a {
	position: relative;
    line-height: 100%;
    display: inline-block;
    color: white;
    text-decoration: none;
    font-size: 0.817vw;
    padding: 3% 0px 3% 7.255%;
    border-bottom: 1px solid white;
}
/*MOREボタンのアイコン*/
#Graduate .GL-Item a:before {
	position: absolute;
    font-family: "Material Icons";
    content: "\e5cc";
    left: -2px;
    top: 50%;
    transform: translateY(-53%);
	transition: left 0.2s ease-in-out;
}
#Graduate .GL-Item a:hover:before {
	left: 5%;
} 
/*各アイテムの背景*/
#Graduate .GraduateList.Flex > .PHYSICS{
	background-image: url("https://www-images.s.u-tokyo.ac.jp/ja/images/graduate1.jpg"); 
}
#Graduate .GraduateList.Flex > .ASTRONOMY{
	background-image: url("https://www-images.s.u-tokyo.ac.jp/ja/images/graduate2.jpg"); 
}
#Graduate .GraduateList.Flex > .EARTH{
	background-image: url("https://www-images.s.u-tokyo.ac.jp/ja/images/graduate3.jpg"); 
}
#Graduate .GraduateList.Flex > .CHEMISTRY{
	background-image: url("https://www-images.s.u-tokyo.ac.jp/ja/images/graduate4.jpg"); 
}
#Graduate .GraduateList.Flex > .BIOLOGICAL{
	background-image: url("https://www-images.s.u-tokyo.ac.jp/ja/images/graduate5.jpg"); 
}
/*アイテムの共通背景画像オプション*/
#Graduate .GraduateList.Flex > article.GL-Item{
	position: relative;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
/*アイテムの共通オーバーレイ*/
#Graduate .GraduateList.Flex > article.GL-Item:before{
	position: absolute;
	content: " ";
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 29, 58, 0.7);
	transition: background-color 0.2s ease-in-out;
	z-index: 0;
}
/*アイテムの共通のホバー時準備*/
#Graduate .GraduateList.Flex > article.GL-Item:after{
	position: absolute;
	content: " ";
	top: 0px;
	left: 0px;
	width: 0%;
	height: 100%;
	background-color: rgba(0, 29, 58, 0.85);
	transition: width 0.4s ease-in-out;
	z-index: 0;
}
/*アイテムの共通のホバー時*/
#Graduate .GraduateList.Flex > article.GL-Item:hover:after{
	width: 100%;
}
/*アイテムの共通オーバーレイによる重ね順対策*/
#Graduate .GraduateList.Flex > article.GL-Item > div {
	position: relative;
	z-index: 1;
}


/*Admissionコーナー
---------------------------------------------------------------------------*/
/*全体*/
#Admission {
    background-color: #E9E9ED;
}
/*コンテナー*/
.AdmissionContainer {
    max-width: 1160px;
    padding: 115px 20px 110px 20px;
    margin: 0px auto;
}
/*コンテンツの入れ物*/
.AdmissionWrap.Flex {
    background-image: url("../images/admission.jpg");
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
	padding: 83px 0px;
}
/*左側コンテンツ*/
.admissionLeft {
    background-color: #002245;
    color: white;
    padding:37px 10px 40px 4.444%;
	width: 49.285%;
}
/*左側コンテンツ　タイトル*/
.admissionLeft h2 {
    font-size: 60px;
    line-height: 130%;
    margin: 0px 0px 5px 0px;
    padding: 0px;
}
/*左側コンテンツ　テキスト*/
.admissionLeft p {
    font-size: 15px;
    font-weight: 100;
    line-height: 150%;
    letter-spacing: 0.05em;
    margin: 0px;
    padding: 0px;
}
/*右側コンテンツ*/
.admissionRight {
	width: 50.715%;
	text-align: center;
}
/*右側コンテンツ ボタン*/
.admissionRight a{
	display: inline-block;
	color: white;
	font-size: 20px;
	font-weight: bold;
	line-height: 120%;
	text-decoration: none;
	padding: 20px 50px 20px 47px;
	position: relative;
	border: 1px solid white;
	margin-bottom: 43px;
	transition: background-color 0.2s ease-in-out;
}
/*右側コンテンツ ボタン ホバー*/
.admissionRight a:hover{
	background-color: #002145;
}
/*右側コンテンツ 最後のボタン*/
.admissionRight > a:last-child {
	margin-bottom: 0px;
}
/*右側コンテンツ ボタン内アイコン*/
.admissionRight a:after {
	position: absolute;
	font-family: "Material Icons";
	font-weight: normal;
    content: "\e5cc";
	font-size: 19px;
	top: 50%;
	right: 22px;
	transform: translateY(-50%);
	transition: right 0.2s ease-in-out;
}
.admissionRight a:hover:after {
	right: 5px;
}


/*研究施設紹介コーナー
---------------------------------------------------------------------------*/
/*施設紹介全体の入れ物*/
#ResearchFacility {
	margin-top: 185px;
	margin-bottom: 175px;
	padding: 0px;
}
/*施設紹介全体のタイトルとサブタイトル*/
#ResearchFacility > h3,
#ResearchFacility > h2 {
	text-align: center;
	padding: 0px 20px;
	border: none;
	color: #202020;
}
/*施設紹介全体のタイトル*/
#ResearchFacility > h2 {
	font-size: 40px;
	line-height: 130%;
}
/*施設紹介全体のサブタイトル*/
#ResearchFacility > h3 {
	font-size: 20px;
	line-height: 120%;
	margin: 30px 0px 80px 0px;
}
/*施設紹介内の施設情報の入れ物であるFlex*/
#ResearchFacility .RF-Container.Flex{
	padding: 0px 7.5px;
	-ms-flex-wrap: wrap; /*改行をPCデザインでも有効化*/
	flex-wrap: wrap;
}
/*各施設の入れ物設定*/
#ResearchFacility .RF-Item {
	width: 20%;
	padding: 0px 7.5px;
	margin-bottom: 15px;
}
/*入れ物内のテキストデコレーションを無効化*/
#ResearchFacility .RF-Item > a {
	text-decoration: none;
}
/*各施設の画像の入れ物*/
#ResearchFacility .RF-Image {
    overflow: hidden;
}
/*各施設の画像*/
#ResearchFacility .RF-Image > img {
	width: 100%;
	height: auto;
	transition: transform 0.2s ease-in-out;
}
/*各施設名*/
#ResearchFacility .RF-Item h2{
	font-size: 15px;
	line-height: 150%;
	font-weight: 500;
	padding: 16px 6px;
	color: #444444;
	transition: opacity 0.2s ease-in-out;
}
/*ホバー時*/
#ResearchFacility .RF-Item > a:hover .RF-Image > img {
	transform: scale(1.1,1.1);
}
#ResearchFacility .RF-Item > a:hover h2 {
	opacity: 0.7;
}

/*pickupスライドショーコーナー（slickを使用）
---------------------------------------------------------------------------*/
/*スライドショー全体を囲むボックス*/
.pickup {
	position: relative;
	display: flex;			/*flexボックスを使う指定*/
}

/*マウスオン時の設定。
マウスオンでスライドがストップしてしまうので、それがわかりやすいようにopacityを設定しました。
もしマウスオンでストップさせたくない場合は、slick.cssの「//pauseOnHover: false,」の行の冒頭の「//」を外して適用して下さい。*/
.pickup .list:hover figure {
	opacity: 0.8;	/*透明度。色が80%出た状態。*/
}

/*１個あたりのボックス*/
.pickup .slick-slide {
	margin: 5px !important;
	width: auto;
}

/*ボックス内のh4タグ*/
.pickup .list h4 {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;	/*表示させたい行数。*/
    line-height: 1.5em;		/*IE対策。行間。１行あたりの高さの事。1.5文字分。*/
    height: 1.5em;			/*IE対策。高さ。*/
}

/*ボックス内のpタグの最大の高さ。*/
.pickup .list p {
    height: 4.4em;
}

/*ボックス内の画像*/
.pickup .list img {
	object-fit: cover;	/*トリミングのタイプ*/
	height: 70px;		/*画像の高さ。下の方で数カ所再設定があります。*/
	width: 100%;		/*画像の幅*/
	font-family: 'object-fit: cover;';	/*IE対策*/
}

/*左右の三角矢印の共通設定*/
.slick-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
}

/*左右の矢印の共通設定。マウスオン時。*/
.slick-arrow:hover {
	cursor: pointer;
	opacity: 0.8;
}

/*左右の矢印の形、色、サイズ*/
.slick-prev::after,
.slick-next::after {
	font-family: "Material Icons";
	content: "\e5cf";
    font-weight: 100;
    display: block;
    font-size: 25px;
    line-height: 100%;
    color: #fff;
    border-radius: 100%;
    padding: 10px;
    background-color: rgba(0,0,0,0.5);
}

/*左側の矢印*/
.slick-prev {
	left: 5px;	/*左からの配置場所*/
}

/*左側の矢印を回転させる指定*/
.slick-prev::after {
	transform: rotate(90deg);
}

/*右側の矢印*/
.slick-next {
	right: 5px;	/*右からの配置場所*/
}

/*右側の矢印を回転させる指定*/
.slick-next::after {
	transform: rotate(-90deg);
}

/*スライドショー（slickを使用）
---------------------------------------------------------------------------*/
.mainimg {
	position: relative;
	padding: 0 !important;
}

/*マウスオン時の設定。
マウスオンでスライドがストップしてしまうので、それがわかりやすいようにopacityを設定しました。
もしマウスオンでストップさせたくない場合は、slick.cssの「//pauseOnHover: false,」の行の冒頭の「//」を外して適用して下さい。*/
.mainimg:hover {
	opacity: 0.8;	/*透明度。色が80%出た状態。*/
}

/*丸いページナビボタン全体を囲むブロック*/
.slick-dots {
	text-align: center;
	width: 100%;
	margin:0;
	line-height: 1;
	position: absolute;
	bottom: 10px;	/*下からの配置場所指定*/
}

/*丸いページナビボタン１個あたりの設定*/
.slick-dots li {
	display: inline-block;
	margin: 0 10px;
	cursor: pointer;
}

/*buttonタグ*/
.slick-dots li button {
	display: block;
	text-indent: -9999px;	/*デフォルトで文字が出るので画面の外に追い出す指定*/
	width: 12px;			/*ボタンの幅*/
	height: 12px;			/*ボタンの高さ*/
	border-radius: 50%;		/*丸くする指定*/
	cursor: pointer;		/*クリックで画像へジャンプするので、わかりやすいようhover時にpointerになるように。*/
	background: #fff;		/*背景色。白。*/
}

/*buttonのアクティブ時（現在表示されている画像を示すボタン）*/
.slick-dots li.slick-active button {
	background: #3551de;	/*色*/
}

/*「お知らせ」ブロック
---------------------------------------------------------------------------*/
/*お知らせブロック*/
#new {
	display: flex;		/*flexボックスを使う指定*/
	flex-wrap: wrap;	/*折り返す指定*/
	padding: 0 5px;		/*上下、左右へのボックス内の余白*/
}

/*日付(dt)、記事(dd)共通設定*/
#new dt,
#new dd {
	border-bottom: 1px solid #ccc;	/*下線の幅、線種、色*/
	padding: 5px 0;					/*上下、左右へのボックス内の余白*/
}

/*日付(dt)設定*/
#new dt {
	width: 8em;	/*幅。8文字(em)分。※下の「800px以上」の端末用の設定に再設定があります。*/
}

/*日付の横のマーク（共通設定）*/
#new dt span {
	display: none;	/*小さな端末では非表示にしておく。*/
}

/*bg1設定。サンプルテンプレートでは「賃貸物件」と書いてあるマーク*/
#new dt span.icon-bg1 {
	background: #386091;	/*背景色*/
}

/*bg2設定。サンプルテンプレートでは「売買物件」と書いてあるマーク*/
#new dt span.icon-bg2 {
	background: #91384d;	/*背景色*/
}

/*記事(dd)設定*/
#new dd {
	width: calc(100% - 8em);	/*「8em」は上の「#new dt」のwidthの値です。※下の「800px以上」の端末用の設定に再設定があります。*/
}

/*その他
---------------------------------------------------------------------------*/
.clearfix::after {content: "";display: block;clear: both;}
.color-theme, .color-theme a {color: #3551de !important;}
.color-check, .color-check a {color: #f00 !important;}
.c {text-align: center !important;}
.ws {width: 95%;display: block;}
.wl {width: 95%;display: block;}
/* .large {font-size: 2rem;} */
.large {font-size: 2em;}
.mb30 {margin-bottom: 30px !important;}
.look {display: inline-block;border: 1px solid #ccc;padding: 5px 20px;background: rgba(0,0,0,0.03);border-radius: 5px;margin: 5px 0;}
.ofx {overflow-x: hidden;}

/* UT追加 */
/* 旧サイト layout.css より一部のみコピー */
/* color */
.black{
	color: #000000;
}
.red{
	color: #ff0000;
}
/* bold */
.bold{
	font-weight: bold;
}
.no_bold{
	font-weight: normal!important;
}
/* none */
.d_none{
	display: none;
}
.li_none{
	list-style: none!important;
}
.no_indent{
	text-indent: 0!important;
}
.bg_i_none{
	background-image: none!important;
}
.bd_r_none{
	border-right: none!important;
}
.bd_b_none{
	border-bottom: none!important;
}

/* line */
.under_l{
	text-decoration: underline;
}

/* 画像配置 */
div.imgItemUT{
	display: flex;
	justify-content: space-between;
}


/*---------------------------------------------------------------------------
ここは画面幅1310px以下の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:1310px) {
    #pc__global-2 {
        font-size: 12px;
    }
}


/*---------------------------------------------------------------------------
ここから下は画面幅480px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:480px) {

/*ボックス内の画像*/
.pickup .list img {
	height: 120px;		/*画像の高さ*/
}

/*　※注意！　下の閉じカッコ　}　は480px以上の設定に必要なので、削除しないようにしてください。　*/

}



/*---------------------------------------------------------------------------
ここから下は画面幅600px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:600px) {

/*ボックス内の画像*/
.pickup .list img {
	height: 160px;		/*画像の高さ*/
}

/*　※注意！　下の閉じカッコ　}　は600px以上の設定に必要なので、削除しないようにしてください。　*/
}



/*---------------------------------------------------------------------------
ここから下は画面幅800px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:800px) {


/*全体の設定
---------------------------------------------------------------------------*/
html, body {
	font-size: 18px;	/*基準となるフォントサイズの上書き*/
}

/*section全般の設定*/
section + section {
	padding-top: 50px;	/*sectionの間に空けるスペース*/
}

/*header　ロゴなどが入った最上段のボックス。
---------------------------------------------------------------------------*/
/*logo画像*/
header .primary {
	padding: 0px 20px;
}
header #logo {
	width: auto;	/*画像の幅*/
	margin: 0;		/*中央から左に戻る為の設定*/
}

/*３本バー（ハンバーガー）アイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	display: none;	/*非表示にする*/
}

/*大きな端末用のメインメニューの設定
---------------------------------------------------------------------------*/
/*ボックス全体の設定*/
#menubar {
	display: block;	/*表示させる*/
}
/*ul要素。メニュー１個１個を囲む親のボックス。*/
#menubar > ul {
	margin: 0;
	list-style: none;
	display: flex;						/*flexボックスを使う指定*/
	justify-content: space-around;		/*並びかたの種類の指定*/
	border-top: 1px solid #dcdcdc;		/*上の線の幅、線種、色*/
	border-bottom: 1px solid #dcdcdc;	/*下の線の幅、線種、色*/
	line-height: 1.5;					/*行間を少しだけ狭く*/
}

/*メニュー１個あたりの設定*/
#menubar > ul > li {
	flex: 1;			/*それぞれのメニューが幅一杯に広がるように*/
	text-align: center;	/*テキストをセンタリング*/
	position: relative;
}

/*ラインアニメーションの設定*/
#menubar > ul > li::before {
	content: "";
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 5px;
	background: #3551de;			/*線となる背景の色*/
	transition: 0.3s;				/*アニメーションの実行時間は0.3秒。*/
	transform: scaleX(0);			/*幅。最初は0にして見えなくしておく。*/
	transform-origin: center top;	/*線の出現起点が左からになるように。中央からの出現がよければこの１行削除。*/
}

/*アニメーション結果。ライン幅が100%になる。*/
#menubar > ul > li:hover::before {
	transform: scaleX(1);
}

/*リンクテキスト*/
#menubar > ul > li > a {
	text-decoration: none;
	display: block;
	color: #333;	/*文字色*/
	padding: 12px 0px 17px 0px;	/*上、右、下、左への余白*/
}

/*アイコン画像（アイコンにはFont Awesomeを使用）*/
#menubar i {
	display: block;			/*改行が入るようにblock指定。もし横に並べたいならこの１行を削除し、下のpadding-bottomをpadding-rightに変更します。*/
	padding-bottom: 10px;	/*アイコンの下に空ける余白*/
	color: #3551de;			/*文字色＝アイコン色になります。*/
}

/*アイコンのマウスオン時*/
#menubar > ul > li:hover i {
	transition: 0.3s;		/*アニメーション時間。0.3秒。*/
	transform: scale(1.15);	/*サイズを1.15倍にする。*/
}

/*spanタグ（装飾用のテキスト）*/
#menubar > ul > span {
	display: block;
	font-size: 0.5rem;	/*文字サイズ。*/
	opacity: 0.6;		/*透明度。0.6は60%色が出た状態。*/
	letter-spacing: 0.2em;	/*文字間隔を少しだけ広くとる指定*/
}

/*mainブロック設定
---------------------------------------------------------------------------*/
/*mainブロックの設定*/
main {
	padding: 50px;	/*ボックス内の余白*/
}

/*フッターメニュー設定
---------------------------------------------------------------------------*/
/*ボックス全体の設定*/
#footermenu {
	font-size: 0.8rem;	/*文字サイズ。remの単位についてはテンプレート内の解説をお読み下さい。*/
	padding: 20px 55px;	/*上下、左右へのボックス内の余白*/
}
/*フッター右側の装飾画像*/
#footermenu .kazari {
	display: block;		/*非表示から表示に。*/
	max-width: 200px;	/*画像の最大幅。これ以上大きくならないように。*/
}

/*テーブル
---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.ta1 caption {
	padding: 20px 15px;		/*上下、左右へのボックス内の余白*/
}

/*th（左側）、td（右側）の共通設定*/
.ta1 th, .ta1 td {
	padding: 20px 15px;		/*上下、左右へのボックス内の余白*/
}

/*th（左側）のみの設定*/
.ta1 th {
	width: 20%;		/*幅*/
}

/*よく頂く質問
---------------------------------------------------------------------------*/
/*質問*/
.faq dt {
	text-indent: -58px;				/*テキストのインデントの調整*/
	padding: 20px 20px 20px 58px;	/*余白の調整*/
}

/*listブロック設定
---------------------------------------------------------------------------*/
/*１個あたりのボックス*/
.list {
	width: 23%;				/*ボックスの幅*/
	margin-bottom: 25px;	/*ボックス同士の上下間の余白*/
}

/*「お知らせ」ブロック
---------------------------------------------------------------------------*/
/*日付(dt)設定*/
#new dt {
	width: 14em;	/*幅。14文字(em)分。*/
	display: flex;	/*flexボックスを使う指定*/
	justify-content: space-between;	/*日付とアイコンをそれぞれ端に寄せる*/
}

/*日付の横のマーク（共通設定）*/
#new dt span {
	display: inline-block;	/*表示させる、*/
	width: 6em;				/*幅。6文字(em)分。*/
	background: #999;		/*背景色*/
	color: #fff;			/*文字色*/
	font-size: 0.9rem;		/*文字サイズ。*/
	text-align: center;		/*文字をセンタリング*/
	border-radius: 3px;		/*角を少しだけ丸くする*/
	margin-right: 1.2em;	/*アイコンの右側に空けるスペース*/
	align-self: flex-start;	/*高さを間延びさせない指定*/
	line-height: 1.5;		/*行間を少し狭く*/
	position: relative;top: 0.4em;	/*上下の配置バランスの微調整*/
}

/*記事(dd)設定*/
#new dd {
	width: calc(100% - 14em);	/*「14em」は上の「#new dt」のwidthの値です。*/
}

/*btnの設定
---------------------------------------------------------------------------*/
/*ボタン*/
.btn a {
	padding: 15px 40px;		/*上下、左右へのボタン内の余白*/
	letter-spacing: 0.1em;	/*文字間隔を少しだけ広く*/
}

/*右側の矢印アイコン（アイコンにはFont Awesomeを使用）*/
.btn i {
	padding-left: 20px;		/*アイコンとテキストの間に空ける余白*/
}

/*詳細ページの画像切り替え（imgchg_pack.js）※一般のhtmlテンプレートで利用。
---------------------------------------------------------------------------*/
/*大きな画像のボックスと説明文を入れるボックス*/
#item-image {
	width: 80%;
}

/*パノラマ画像のサイズ設定（※CMS用）
---------------------------------------------------------------------------*/
.panorama-img {
	height: 500px !important;
}

/*pickupスライドショーコーナー（slickを使用）
---------------------------------------------------------------------------*/
/*スライドショー全体を囲むボックス*/
.pickup {
	padding: 20px;		/*ボックス内の余白*/
}

/*１個あたりのボックス*/
.pickup .slick-slide {
	margin: 10px !important;
}

/*ボックス内の画像*/
.pickup .list img {
	height: 100px;		/*画像の高さ*/
}

/*お知らせ及びイベントのコンテナー
---------------------------------------------------------------------------*/
.InfoContainer {
	border-radius: 13px;
}  

/*その他
---------------------------------------------------------------------------*/
.ws {width: 45%;display: inline-block;}

/*　※注意！　下の閉じカッコ　}　は800px以上の設定に必要なので、削除しないようにしてください。　*/

}



/*---------------------------------------------------------------------------
ここから下は画面幅1000px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:1000px) {

/*ボックス内の画像*/
.pickup .list img {
	height: 150px;		/*画像の高さ*/
}

/*　※注意！　下の閉じカッコ　}　は1000px以上の設定に必要なので、削除しないようにしてください。　*/

}

/*---------------------------------------------------------------------------
ここから下は画面幅1190px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:1190px) {

	.max1189px__hide {
		display: block;
	}
	.max1189px__show {
		display: none;
	}
}

/*---------------------------------------------------------------------------
ここから下は画面幅1190px未満の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:1189px) {

.max1189px__hide {
	display: none;
}
.max1189px__show {
	display: block;
}

/*お知らせコーナー
---------------------------------------------------------------------------*/
.News > .Flex > .Flex{
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.News > .Flex > .Flex > .Flex{
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
}
.News .Post > .Flex > a {
  display: block;
  width: 100%;
}

/*MEDIAコーナー
---------------------------------------------------------------------------*/
.FeaturesWrap > .Flex {
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}
.FeaturesWrap > .Flex > .FeaturesContent {
	width: 100%;
}
#FeaturesArticle.Flex {
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
#FeaturesArticle.Flex > article {
	width: 48%;
	margin-right: 0px;
	margin-bottom: 20px;
}

/*学務からのお知らせ
---------------------------------------------------------------------------*/
.GN-Container.Flex {
	display: block;
}
.GakumuNews {
    padding: 40px 0px 0px 0px; 
}
#GN-Slider,
#GN-Slider__SP {
    width: 100%;
    padding: 120px 20px 0px 20px;
}
#GN-Slider .slick-dots,
#GN-Slider__SP .slick-dots {
    left: 0px;
}
main #GN-Slide__PrevArrow,
main #GN-Slide__NextArrow {
    top: 25px;
    right: auto;
    transform:translateX(-50%);
}
#GN-Slide__PrevArrow {
    left: calc(50% - 30px);
}
#GN-Slide__NextArrow {
    left: calc(50% + 30px);
}
.GakumuNews a.MoreButton {
    border-left: none;
}
#GN-Slider a.Flex,
#GN-Slider__SP a.Flex {
    margin-bottom: 30px;
}

/*フッターメニュー設定
---------------------------------------------------------------------------*/
/*メニューを縦並びに変更*/
#footermenu > .f-container {
	display: block;
}
/*下側メニューの設定*/
#footermenu > .f-container > ul:not([class]) {
	max-width: 100%;
	min-width: 100%;
	padding-left: 0px;
	margin-top: 60px;
}

/*　※注意！　下の閉じカッコ　}　は1190px未満の設定に必要なので、削除しないようにしてください。　*/
}

/*---------------------------------------------------------------------------
ここから下は画面幅1000px未満の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:991px) {

/*お知らせコーナー
---------------------------------------------------------------------------*/
.InfoWrap.Flex{
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.News {
	width: 100%;
	padding: 0px;
}
/*イベントコーナー
---------------------------------------------------------------------------*/
article.Events {
	width: 100%;
	margin-top: 80px
}
}


/*---------------------------------------------------------------------------
ここから下は画面幅992px未満の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:991px) {
/*header
---------------------------------------------------------------------------*/
/*logo画像*/
header .primary {
	text-align: center;
    width: 100%;
}
header #logo{
    float:left;
    margin-left:15px;
}
/*MOREボタン
---------------------------------------------------------------------------*/
a.MoreButton {
	padding: 50px 0px 20px 0px;
	line-height: 80%;
	background-color: #f3f3f3;
}
a.MoreButton:after {
	width: 100%;
}
.MoreIcon:before,
.MoreIcon:after {
	width: 16px;
	background-color: #8ab9db;
}
.MoreButton span {
	color: #8ab9db;
}
a.MoreButton:hover {
	background-color: white;
}

/*Flexクラスの設定
---------------------------------------------------------------------------*/
.Flex{
	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}

/*重要なお知らせ
---------------------------------------------------------------------------*/
.HI_Link{
	padding: 7px 10px 10px 10px;
}
#HeaderInfo > a > .Right > .Flex,
#HeaderInfo > a > .Left > .Flex{
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
}
.HI_Link > .Right,
.HI_Link > .Left {
    width: 100%;
}
.HI_Link > .Left{
	border-right: none;
}
.HI_Link > .Right{
	margin-top:8px;
	padding-left: 0px;
}
.HI_Icon > span {
	font-size: 30px;	/*重要なお知らせタイトル横のアイコンサイズ*/
    margin-right: 0px;
	padding-bottom: 2px;	/*上下位置の微調整*/
}
.HI_Title > div{
	line-height:32px;	/*重要なお知らせタイトルの上下位置調整*/
	font-size:18px;
}
.HI_Date,
.HI_Text {
	text-align: left;
}
.HI_Date {
	margin-right: 20px;
	font-size: 14px;
}
.HI_Text {
	font-size:16px;
}
.HI_Container .HI_Title {
	display: none;
}
.HI_Container > .Left {
	min-width: auto;
	padding-right: 10px;
}
.HI_Container > .Right {
	padding-left: 10px;
	border-left: none;
}
.HI_Container .Flex {
	display: block;
}
.HI_Container > .Right > .Flex:not(:last-child){
	margin-bottom: 10px;
}
.HI_Container > .Right .HI_Date {
	margin-bottom: 5px;
}

/*header　ロゴなどが入った最上段のボックス。
---------------------------------------------------------------------------*/
/*スマホ時はFixed解除*/
header#GlobalHeader {
	top: 0px;
}
/*要素を縦中央揃え、横は幅一杯に設定*/
html header {
	flex-direction: row;
    justify-content: space-between;
}
/*Logo画像*/
header .primary {
	padding: 5px 0px;
    max-width: calc(100% - 130px);
}
header #logo {
	line-height: 100%;
}
/*SP メニュー global2
---------------------------------------------------------------------------*/
#sp__global ul.sp__global2.Flex > li {
    width: 49%;
}
#sp__global ul.sp__global2.Flex > li:not(:first-child,:nth-of-type(2)) {
    margin-top: 10px;
}
/*SP メニュートリガー
---------------------------------------------------------------------------*/
div#sp__visitor-trigger,
div#sp__global-trigger {
	width: 60px;
	padding: 0px 0px 0px 0px;
}
div#sp__visitor-trigger > .material-icons,
div#sp__global-trigger > .material-icons {
	font-size: 36px;
}
/*SP メニュートリガー　2022/11/15 変更に伴い追記
---------------------------------------------------------------------------*/
#sp__global-container #sp__global-trigger {
    padding-top: 0px;
    line-height: 0.9;
}
div#sp__visitor-trigger {
    padding: 0px 0px 0px 0px;
}
div#sp__visitor-trigger > .material-icons {
    font-size: 32px;
}

#sp__global-container .BurgerIcon {
    width: 27px;
    height: 20px;
    margin-bottom: 8px;
}
#sp__global-container.active .BurgerIcon span:nth-of-type(1){
    transform: translateY(-9px) rotate(-45deg);
}
#sp__global-container.active .BurgerIcon span:nth-of-type(3){
    transform: translateY(9px) rotate(45deg);
}
/*ターゲット別メニューとアイコンメニュー*/
header .secondary {
    display: none;	/*非表示*/
}
/*アイコンメニューをモバイルデザインに変更*/
header .tertiary{
	min-width:117px;	/*ターシァリの幅*/
	max-width:117px;
}
/*アイコンメニューの親メニューのサイズ*/
header .tertiary > nav > ul > li {
	width:117px;
	height:117px;
}
/*アイコンメニューの最後の要素であるMENU項目以外を非表示*/
header .tertiary > nav > ul > li:not(:last-of-type) {
    display: none;	
}
#IconsMenu {
	/*PCデザイン時には#GlobalHeaderの幅でサブメニューを表示*/
	position: static;
}
/*アイコンメニューのサブメニューのサイズ等の再指定*/
#IconsMenu .sub {
	top: 117px;	/*アイコンメニューの親メニューのサイズに合わせて調整*/
	width: 100%;
	right: -100vw;
	height: auto !important;
	overflow: hidden;
}

/*メインビジュアル
---------------------------------------------------------------------------*/
#MainSlider [class^="MS-Slide"] .slide-image {
	height: 300px;
}
.slick-arrow {
    display: none !important;
}
#MainSlider .slick-dots > li {
	width: 8%;
}

/*セクション・コンテナー
---------------------------------------------------------------------------*/
#InfoSection {
	background-color: white;
}
#GakumuNewsSection,
#InfoSection,
#FeaturesSection,
#PressReleaseSection {
	padding: 0px;
}
main .DepartmentsWrap,
main .GakumuNewsWrap {
	padding: 0px;
}
.GakumuNews,
main .PressReleaseWrap,
main .FeaturesWrap,
main .InfoWrap {
	padding: 80px 20px;
}

/*お知らせコーナー
---------------------------------------------------------------------------*/
.InfoWrap.Flex {
	display: block;
}
#InfoSection .InfoWrap > #InfoTab,
#InfoSection .InfoWrap > #IT-Content{
	width: 100%;
}

/*お知らせコーナー　タブ切り替えボタン
---------------------------------------------------------------------------*/
#InfoTab {
	margin: 0px;
}
#InfoTab > li:not(#IT-All) {
	display: none;

}
#InfoTab > li.active:before {
	content: none;
}
/*お知らせコーナー　タブ切り替えコンテンツ
---------------------------------------------------------------------------*/
#InfoSection #IT-Content > article > article.post > .PostContainer {
	position: relative;
    top: 0%;
    transform: none;
}
#InfoSection article.post {
	padding: 40px 0px;
}

/*MEDIAコーナー
---------------------------------------------------------------------------*/
section#FeaturesSection {
	padding-top: 0px;
}
#FeaturesArticle.Flex > article {
	width: 100%
}
#FeaturesArticle.Flex > article:last-child {
	margin-bottom: 0px;
}
#FeaturesSection .MoreButton {
	background-color: white;
}
#FeaturesSection .MoreButton:hover {
	background-color: #f6f9fb;
}
.FeaturesWrap > p {
	text-align: left;
}

/*プレスリリーススライドコーナー
---------------------------------------------------------------------------*/
#PR-Slider {
	padding-top: 180px;
}
#PR-Slider .slick-prev,
#PR-Slider .slick-next {
	top: 85px;
	transform: translateX(50%);
}
#PR-Slider .slick-prev {
	right: calc(50% + 27px);
}
#PR-Slider .slick-next {
	right: calc(50% - 27px);
}
#PR-Slider .slick-dots {
	width: 80%;
}
[class^="PR-Slide"] > .Flex {
	-ms-flex-wrap: wrap;
	  flex-wrap: wrap;
}
.PR-Post {
	width: 100%;
	margin-bottom: 40px;
}
[class^="PR-Slide"] > .Flex > .PR-Post:last-child {
	margin-bottom: 0px;
}

/*学務からのお知らせ
---------------------------------------------------------------------------*/
#GN-Slider a.Flex,
#GN-Slider__SP a.Flex {
	display: block;
}
#GN-Slider,
#GN-Slider__SP {
	padding: 120px 0px 0px 0px;
}
.GN-Image {
	margin: 0px auto 10px auto;
}
.GN-Texts {
	padding: 0px;
	width: 100%;
	max-width: 500px;
}
.GakumuNews {
	padding: 80px 20px;
}
.GakumuNews a.MoreButton {
	background-color: white;
}
.GakumuNews a.MoreButton:hover {
	background-color: #f7f7f7;
}
.GakumuNews a.MoreButton:not(:hover):after {
	width: 0px;
}

/*Admissionコーナー
---------------------------------------------------------------------------*/
.AdmissionWrap.Flex {
    background-position: 68% 0%;
}

/*研究施設紹介
---------------------------------------------------------------------------*/
/*施設紹介全体の入れ物*/
#ResearchFacility {
	margin-top: 60px;
	margin-bottom: 60px;
}
/*施設紹介全体のタイトル*/
#ResearchFacility > h2 {
	font-size: 22px;
}
/*施設紹介全体のサブタイトル*/
#ResearchFacility > h3 {
	font-size: 18px;
	margin: 20px 0px 50px 0px;
}
/*施設紹介内の施設情報の入れ物であるFlex*/
#ResearchFacility .RF-Container.Flex{
	padding: 0px 7.5px;
}
/*各施設の入れ物設定*/
#ResearchFacility .RF-Item {
	width: 50%;
	padding: 0px 12.5px;
}
/*各施設名*/
#ResearchFacility .RF-Item h2 {
	font-size: 13px;
	padding: 10px 4px; 
}

/*フッターメニュー設定
---------------------------------------------------------------------------*/
/*メニューの設定*/
#footermenu > .f-container > ul:not([class]),
#footermenu > .f-container > ul.left-menu {
	max-width: 240px;
	min-width: auto;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
/*下側メニューを縦並びに変更*/
#footermenu > .f-container > ul:not([class]) > li.Flex {
	display: block;
}
#footermenu > .f-container > ul:not([class]) > li.Flex > ul{
	width: 100%;
}
.footerContainer .Flex {
	display:block;
	text-align: center;
}
.footerContainer .Flex > div {
	margin-bottom: 15px;
}


/*admissionコーナー
---------------------------------------------------------------------------*/
/*コンテナー*/
.AdmissionContainer {
	padding: 60px 20px;
}
/*コンテンツの入れ物*/
.AdmissionWrap.Flex {
	padding: 0px 0px 83px 0px;
	display: block;
}
/*左側コンテンツ*/
.admissionLeft {
	width: 100%;
	padding: 35px 25px 35px 30px;
}
/*左側コンテンツ タイトル*/
.admissionLeft h2 {
	font-size: 40px;
	text-align: center;
}
/*左側コンテンツ テキスト*/
.admissionLeft p {
	font-size: 15px;
	text-align: left;
}
/*右側コンテンツ*/
.admissionRight {
	padding: 0px 20px;
	margin-top: 80px;
	width: 100%;
}

/*　※注意！　下の閉じカッコ　}　は800未満の設定に必要なので、削除しないようにしてください。　*/
}

/*---------------------------------------------------------------------------
ここから下は画面幅500px未満の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:499px) {
/*メインビジュアルビデオ内のテキストコンテンツ
---------------------------------------------------------------------------*/
.cont-inner{
	width: 100%;
	padding: 6% 4% 6% 6%;
}
/*メインの英語テキスト*/
.MainVisual .cont-inner .main-text {
	font-size: 9.25vw;
	line-height: 145%;
}
/*サブの日本語テキスト*/
.MainVisual .cont-inner .sub-text {
	margin-top:6%;
	font-size: 4.5vw;
} 

/*　※注意！　下の閉じカッコ　}　は500未満の設定に必要なので、削除しないようにしてください。　*/
}



/*--------------------------------------------------------------------------

ここから下はサブページ用

---------------------------------------------------------------------------*/

/*サブページ用　エントリーバー
---------------------------------------------------------------------------*/
/*エントリーバー全体の入れ物*/
.EntryBar {
    position: relative;
    overflow: hidden;
}
/*オーバーレイ*/
.EntryBar:before {
    position: absolute;
    content: " ";
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 34, 69, 0.6);
    z-index: 1;
}
/*エントリーバーの背景画像*/
.EntryBar img {
    position: absolute;
    min-width: 100%;
    max-width: none;
    min-height: 100%;
    max-height: none;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 0;
}
/*エントリーバー内のタイトルの入れ物*/
.EntryBar .EntryBarContainer {
    position: relative;
    max-width: 1397px;
    padding: 155px 40px;
    margin: 0px auto;
    z-index: 2;
}
/*縦の白線*/
.EntryBar .EntryBarContainer:before {
    position: absolute;
    content: " ";
    width: 1px;
    height: 153px;
    background-color: #ccc;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
}
/*エントリバー内タイトル*/
.EntryBar h2 {
    position: relative;
    font-size: 46px;
    font-weight: 500;
    line-height: 120%;
	letter-spacing: 0.15em;
    color: white;
    padding: 40px 0px;
    text-align: center;
}
/*黄色の横線*/
.EntryBar h2:after {
    position: absolute;
    content: " ";
    width: 90px;
    height: 4px;
    background-color: #FCB813;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
}

/*サブページ用　エントリー
---------------------------------------------------------------------------*/
/*エントリー全体の入れ物*/
.Entry {
    background: #EBF4FC;
    padding: 120px 0px 100px 0px;
}
@media screen and (max-width:991px){
    .Entry {
        padding: 40px 0px 40px 0px;
    }
}
/*エントリーのコンテナー*/
.EntryContainer {
    max-width: 1397px;
    padding: 0px 20px;
    margin: 0px auto;
}
/*エントリー内のaタグ*/
.Entry a {
    color: #003973;
    text-decoration: none;
    font-weight: bold;
    transition: opacity 0.15s ease-in-out;
}
.Entry a:hover {
    opacity: 0.7;
}
/*エントリーコンテンツの入れ物*/
.EntryContent {
    background-color: white;
    padding: 100px 8.47%;
}
/*メインコンテンツとサイドコンテンツの幅*/
.EntryContent main {
    width: calc(92.5% - 240px);
}
.EntryContent aside {
    width: 240px;
    margin-left: 7.5%;
}

/*サブページ用　エントリー内パンくずリスト
---------------------------------------------------------------------------*/
/*パンくずリストの入れ物*/
.BreadCrumb {
    background-color: #fff;
    border-bottom:1px solid #EBF4FC;
}
/*パンくずリスト全体*/
.BreadCrumb ul{
    margin: 0px;
    padding: 13px 23px;
    list-style: none;
    line-height: 140%;
    font-size: 13px;
    font-weight: bold;
    flex-wrap: wrap;
}
/*各パンくずリストアイテム*/
.BreadCrumb li {
    margin-right: 10px;
}
/*各パンくずリストアイテムアイコン*/
.BreadCrumb li:after {
    font-family: "Material Icons";
    content: "\e5cc";
    vertical-align: middle;
    margin-left:12px;
    font-size: 16px;
    font-weight: normal;
}
/*最後のリストアイテムのアイコン削除*/
.BreadCrumb > ul > li:last-child:after{
    content: none;
}

/*サブページ用　エントリー内コンテンツ
---------------------------------------------------------------------------*/
/*基本文字サイズ*/
body .Entry aside{
	font-size: 15px;
	line-height:120%;
}
body .Entry main {
	font-size: 15px;
	line-height: 200%;
}
/*h1タグ*/
.Entry main h1 {
    font-size: 42px;
	font-weight: normal;
	padding: 0px;
	margin: 0px 0px 80px 0px;
	line-height: 120%;
	letter-spacing: 0.15em;
	color: #111111;
}
/*h2タグ*/
.Entry main h2 {
    font-size: 36px;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: 0.1em;
    padding: 0px 0px 26px 0px;
    margin: 80px 0px 35px 0px;
    position: relative;
	color: #222222;
}
.Entry main h2:before {
	position: absolute;
	content: " ";
	width: 19%;
	height: 6px;
	background-color: #002245;
	left: 0px;
	bottom: 0px;
}
/*h3タグ*/
.Entry main h3 {
    font-size: 30px;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: 0.1em;
    padding: 0px 0px 20px 0px;
    margin: 70px 0px 50px 0px;
	border-bottom: 2px solid #BBBBBB;
    position: relative;
	color: #222222;
}
.Entry main h3:before {
	position: absolute;
	content: " ";
	width: 19%;
	height: 2px;
	background-color: #002245;
	left: 0px;
	bottom: -2px;
	z-index: 2;
}
/*h4タグ*/
.Entry main h4 {
    font-size: 28px;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: 0.1em;
    padding: 0px 0px 0px 12px;
	margin: 50px 0px 22px 0px;
	color: #222222;
	border-left: 4px solid #002245;
}
.Entry main h4.border-none {
	padding: 0px;
	border-left: none;
}
/*h5タグ*/
.Entry main h5 {
    font-size: 23px;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: 0.1em;
	padding: 0px;
	margin: 40px 0px 15px 0px;
	color: #222222;
}
/*h6タグ*/
.Entry main h6 {
    font-size: 18px;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: 0.1em;
	padding: 0px;
	margin: 40px 0px 11px 0px;
	color: #222222;
}

/*pタグ*/
.Entry main p {
    margin: 0px 0px 30px 0px;
}
/*hrタグ*/
.Entry main hr {
    clear: both;
    margin: 80px auto;
    border: none;
    background: linear-gradient(to right, #FFF 15%, #CCC, #FFF 85%);
    height: 1px;
}
/*w(幅)指定*/
.Entry main .w5 { width: 5%;}
.Entry main .w10 { width: 10%; }
.Entry main .w15 { width: 15%; }
.Entry main .w20 { width: 20%; }
.Entry main .w25 { width: 25%; }
.Entry main .w30 { width: 30%; }
.Entry main .w35 { width: 35%; }
.Entry main .w40 { width: 40%; }
.Entry main .w45 { width: 45%; }
.Entry main .w50 { width: 50%; }
.Entry main .w55 { width: 55%; }
.Entry main .w60 { width: 60%; }
.Entry main .w65 { width: 65%; }
.Entry main .w70 { width: 70%; }
.Entry main .w75 { width: 75%; }
.Entry main .w80 { width: 80%; }
.Entry main .w85 { width: 85%; }
.Entry main .w90 { width: 90%; }
.Entry main .w95 { width: 95%; }
/*eFlex*/
.Entry main .eFlex {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;	
}
.Entry main .eFlex.start {
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
}
.Entry main .eFlex.end {
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
}
.Entry main .eFlex.center {
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
.Entry main .eFlex.s-b {
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.Entry main .eFlex.s-a {
	-ms-flex-pack: distribute;
	justify-content: space-around;
}
/*align*/
.Entry main .align-l {
	text-align: left;
}
.Entry main .align-c {
	text-align: center;
}
.Entry main .align-r {
	text-align: right;
}
/*eFloat*/
.Entry main .eFloat-r {
	float: right;
	margin: 0px 0px 20px 20px;
}
.Entry main .eFloat-l {
	float: left;
	margin: 0px 20px 20px 0px;
}
.Entry main .clear {
	clear: both;
}
/*attachment*/
.Entry main .attachment {
	margin: 0px 0px 20px 0px;
}
.Entry main .attachment-c {
	margin: 0px auto 20px auto;
}
.Entry main .attachment-r {
	margin: 0px 0px 20px auto;
}
.Entry main .attachment-l {
	margin: 0px auto 20px 0px;
}
.Entry main .attachment-c,
.Entry main .attachment-l,
.Entry main .attachment-r,
.Entry main .attachment {
	max-width: 100%;
}
.Entry main .attachment-c > .videoItem,
.Entry main .attachment-l > .videoItem,
.Entry main .attachment-r > .videoItem,
.Entry main .attachment > .videoItem,
.Entry main .attachment-c > .imgItem,
.Entry main .attachment-l > .imgItem,
.Entry main .attachment-r > .imgItem,
.Entry main .attachment > .imgItem {
	margin-bottom: 0px;
	line-height: 120%;
    text-align:center;
}
/*caption*/
.Entry main .caption {
    font-size: 14px;
	line-height: 120%;
	margin: 15px 0px 10px 0px;
}
/*credit*/
.Entry main .credit {
	font-size: 13px;
	text-align: right;
	line-height: 120%;
	color: #545454;
	margin: 15px 0px 10px 0px;
}
/*caption + credit*/
.Entry main .caption + .credit {
	margin: 0px 0px 10px 0px;
}
/*gallery*/
.Entry main .gallery {
	font-size: 0px;
}
.Entry main .gallery > * {
	display: inline-block;
	vertical-align: top;
	margin: 0px 10px 10px 0px;
}

/*サブページ用　エントリー内コンテンツ メインの通常リスト
---------------------------------------------------------------------------*/
/*リスト全体*/
.Entry main ul {
    margin: 0px 0px 1rem 2rem;
}
/*リスト内のリスト*/
.Entry main ul ul {
    margin-left: 1rem;
    margin-bottom: 0.5rem;
}
/*各リスト*/
.Entry main ul > li {
    list-style: none;
    position: relative;
    margin-top: 0.5rem;
}
.Entry main ul > li:before {
    position:absolute;
    content: " ";
    width: 12px;
    height: 4px;
    background-color: #002245;
    left: -1rem;
    top: calc(0.5em + 4px);
}
.Entry main ul > li:after {
    position:absolute;
    content: " ";
    width: 12px;
    height: 4px;
    background-color: #BBBBBB;
    left: -1rem;
    top: calc(0.5em + 9px);
}
/*2段目の各リストの疑似要素*/
.Entry main ul > li > ul > li:before {
    width: 4px;
    height: 4px;
    top: calc(0.5em + 6px);
    left: -0.6rem
}
.Entry main ul > li > ul > li:after {
    content: none;
}
/*3段目の各リストの疑似要素*/
.Entry main ul > li > ul > li > ul > li:before{
    background-color: #BBBBBB;
} 

/*サブページ用　エントリー内コンテンツ メインの数字リスト
---------------------------------------------------------------------------*/
/*リスト全体*/
.Entry main ol {
    margin: 0px 0px 1rem 2rem;
}
/*リスト内のリスト*/
.Entry main ol ol {
    margin-left: 1rem;
    margin-bottom: 0.5rem;
}
/*各リスト*/
.Entry main ol > li {
    margin-top: 0.5rem;
}
/*2段目の各リストのマーカー*/
.Entry main ol ol {
	list-style-type: upper-roman;
}
/*3段目の各リストのマーカー*/
.Entry main ol ol ol {
	list-style-type: lower-latin;
}

/*サブページ用　エントリー内コンテンツ メインのテーブル
---------------------------------------------------------------------------*/
/*テーブルの入れ物*/
.Entry main .tableWrap {
    width: 100%;
    overflow-x: scroll;
    margin: 70px 0px;
}
/*テーブルの入れ物のスクロールバー*/
.Entry main .tableWrap::-webkit-scrollbar {
	width: 7px;
	height: 7px;
}
.Entry main .tableWrap::-webkit-scrollbar-track {
	background-color: #ffffff;
	border-radius: 100px;
}
.Entry main .tableWrap::-webkit-scrollbar-thumb {
	background: radial-gradient(#000e1d, #000e1d);
	width: 130px;
	border-radius: 100px;
}
/*テーブル全体*/
.Entry main table {
	width: 100%;
	text-align: left;
}
/*テーブルthタグとtdタグ*/
.Entry main th,
.Entry main td {
    line-height: 160%;
    padding: 20px 23px;
    font-weight: 500;
    border: 1px solid #BBBBBB;
    white-space: nowrap;
}
/*奇数のtrに対し背景色設定*/
.Entry main table > tbody > tr:nth-of-type(odd) {
    background-color: #EEEEEE;
}
/*thにのみ背景色と文字色を設定*/
.Entry main tr th {
    background-color: #003973;
    color: white;
}

/*サブページ用　エントリー内コンテンツ メインのアコーディオン
---------------------------------------------------------------------------*/
/*アコーディオン全体*/
.Entry main .accordion {
    border: 1px solid #BBBBBB;
}
.Entry main .accordion + .accordion {
    border-top: none;
}
/*ヘッダー部*/
.Entry main .accordion .header {
    cursor: pointer;
	padding: 20px 60px 20px 23px;
    color: #003972;
    font-size: 17px;
    font-weight: bold;
    position: relative;
}
/*ヘッダー内のアイコン*/
.Entry main .accordion .header .material-icons {
    position: absolute;
    right: 23px;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.2s ease-in-out;
}
.Entry main .accordion.active .header .material-icons {
    color: #555555;
    transform: translateY(-50%) scale(0.65,0.65) rotate(-180deg); 
}
/*詳細テキスト領域のインナー*/
.Entry main .accordion .inner {
    padding: 0px 23px 20px 23px;
}
/*詳細テキスト*/
.Entry main .accordion .inner p {
    margin-bottom: 10px;
}
/*ノンアクティブ時の詳細テキスト*/
.Entry main .accordion:not(.active) .inner {
    display: none;
}

/*サブページ用　エントリー内コンテンツ メインのリンク
---------------------------------------------------------------------------*/
/*外部リンク全体*/
.Entry main a[target="_blank"]:after {
    font-family: 'Material Icons';
    content: "\e89e";
    vertical-align: middle;
    margin: 0px 3px 0px 2px;
}
/*pdf*/
.Entry main a[target="_blank"][href$=".pdf"]:after {
	font-family: 'Font Awesome 5 Free';
    content: "\f1c1";
	color: #ff1717;
}

/* 202309 追加 */
/*word*/
.Entry main a[href$=".docx"]:after {
	font-family: 'Font Awesome 5 Free';
    content: "\f1c2";
	color: #1e3050;
}

/*excel*/
.Entry main a[href$=".xlsx"]:after {
	font-family: 'Font Awesome 5 Free';
    content: "\f1c3";
	color: #1e3050;
}
/* 202309 追加 ここまで */

/*サブページ用　エントリー内コンテンツ メインの引用
---------------------------------------------------------------------------*/
/*引用全体*/
.Entry main figure.bq {
    padding: 46px 24px 16px 24px;
    background-color: #EEEEEE;
    border: 1px solid #BBBBBB;
    margin: 15px 0px;
    position: relative;
}
/*アイコン*/
.Entry main figure.bq:before {
    font-family: 'Font Awesome 5 Free';
    position: absolute;
    content: "\f10d";
    font-weight: bold;
    font-size: 10px;
    line-height: 100%;
    background-color: #002245;
    color: white;
    padding: 10px 13px 13px 13px;
    left: 24px;
    top: 0px;
}
/*引用元*/
.Entry main figure.bq figcaption {
	text-align: right;
}

/*サブページ用　エントリー内コンテンツ メインのハッシュタグ・記事分類
---------------------------------------------------------------------------*/
/*ハッシュタグと記事分類の共通*/
.Entry main a.category,
.Entry main .hashtag {
	padding: 7px 17px 7px 19px;
	margin: 5px 5px 5px 0px;
	display: inline-block;
}
/*ハッシュタグのボーダー*/
.Entry main .hashtag{
	border: 1px solid #003973;
    font-size:13px;
    color:#003973;
}
/*ハッシュタグの外部アイコン削除*/
.Entry main .hashtag:after {
	content: none;
}
/*記事分類のアイコン*/
.Entry main a.category:before {
	font-family: "Material Icons";
	content: "\e54e";
	margin-right: 6px;
	vertical-align: middle;
	line-height: 100%;
}

/*サブページ用　エントリー内コンテンツ メインの上付き文字と下付き文字
---------------------------------------------------------------------------*/
.Entry main sup,
.Entry main sub {
	margin: 0px 2px 0px 1px;
}


/*サブページ用　エントリー内コンテンツ サイドバー
---------------------------------------------------------------------------*/
/*サイドバータイトル*/
.Entry aside > h2 {
    padding: 60px 18px;
    background-color: #003973;
    color: white;
    font-size: 24px;
    font-weight: normal;
    line-height: 120%;
    border-left: 10px solid #2E2E45;
    border-radius: 5px;
}
/*サイドバーリスト*/
.Entry aside ul {
    padding: 0px;
    margin: 0px;
    line-height: 120%;
}
/*サイドバーサブリスト*/

.Entry aside ul ul > li > a {
    padding-left: 1em;
    padding-right:1em;
    background-color: #fafafa;
}
/*サイドバー各リストアイテム*/
.Entry aside li  {
    list-style: none;
}
/*サイドバー各リストアイテム内リンクテキスト*/
.Entry aside li > a {
    display: block;
    padding: 20px 0px;
    color: #333333;
    border-bottom: 1px solid #E5E5E5;
}
/*サイドバー各リストアイテム内リンクテキストアイコン*/
.Entry aside > ul > li > ul > li > ul > li > ul > li > a,
.Entry aside > ul > li > ul > li > ul > li > a,
.Entry aside > ul > li > ul > li > a,
.Entry aside > ul > li > a {
    position: relative;
	padding-right:50px;/*aside_pulldown.js で使用する範囲*/
}
.Entry aside > ul > li > ul > li > ul > li > ul > li > a:after,
.Entry aside > ul > li > ul > li > ul > li > a:after,
.Entry aside > ul > li > ul > li > a:after,
.Entry aside > ul > li > a:after{
    position: absolute;
    font-family: "Material Icons";
    color: #777777;
    font-weight: 500;
    content: "\e5cc";
    font-size: 16px;
    top: 50%;
    right: 0px;
    transform: translateY(-50%);
}
/*サイドバー各リストアイテム内リンクテキストアイコン　子要素あり*/
.Entry aside > ul > li > ul > li > ul > li > ul > li.has_child > a:after,
.Entry aside > ul > li > ul > li > ul > li.has_child > a:after,
.Entry aside > ul > li > ul > li.has_child > a:after,
.Entry aside > ul > li.has_child > a:after {
    content: "\e5cf";
    font-size: 18px;
    color: #2584c8;
    transition: transform 0.1s ease-in-out;
}
.Entry aside > ul > li > ul > li > ul > li > ul > li.has_child.active > a:after,
.Entry aside > ul > li > ul > li > ul > li.has_child.active > a:after,
.Entry aside > ul > li > ul > li.has_child.active > a:after,
.Entry aside > ul > li.has_child.active > a:after {
    transform: translateY(-50%) rotate(-180deg);
}
/*サイドバー各リストアイテム内のサブメニューの表示切替用(activeクラスはpull_down.jsから付与)*/
.Entry aside > ul li.has_child > ul{
    display: none;
}
.Entry aside > ul li.has_child.active > ul{
    display: block;
}
/*階層が下がるごとの背景色設定*/
.Entry aside ul ul ul > li > a {
    background-color: #f2f2f2;
    padding-left:30px;
}
.Entry aside ul ul ul ul > li > a {
    background-color: #e6e6e6;
    padding-left:30px;
}

/*サブページ用　エントリー内コンテンツ レスポンシブ
---------------------------------------------------------------------------*/
@media screen and (max-width:991px){
    /*h1タグ*/
    .Entry main h1 {
        font-size: 30px;
    }
    /*h2タグ*/
    .Entry main h2 {
        font-size: 26px;
    }
    /*h3タグ*/
    .Entry main h3 {
        font-size: 22px;
    }
    /*h4タグ*/
    .Entry main h4 {
        font-size: 20px;
    }
    /*h5タグ*/
    .Entry main h5 {
        font-size: 18px;
    }
    /*h6タグ*/
    .Entry main h6 {
        font-size: 16px;
    }
	/*エントリーバーの設定*/
	.EntryBar h2 {
		font-size: 26px;
	}
	/*エントリーコンテンツの入れ物*/
	.Entry .EntryContent {
		padding: 60px 12px;
	}
	/*SPデザイン時のサイドバー*/
	body .Entry aside {
		margin-top: 40px;
	}
	/*PCでのみ表示*/
	.pc-only {
		display: none !important;
	}
	/*w(幅)指定*/
	.Entry .w5,.Entry .w10,.Entry .w15,.Entry .w20,
	.Entry .w25,.Entry .w30,.Entry .w35,.Entry .w40,
	.Entry .w45,.Entry .w50,.Entry .w55,.Entry .w60,
	.Entry .w65,.Entry .w70,.Entry .w75,.Entry .w80,
	.Entry .w85,.Entry .w90,.Entry .w95 { width: 100%; }
	/*eFloat*/
	.Entry main .eFloat-r,
	.Entry main .eFloat-l {
		float: none;
		margin: 0px 0px 20px 0px;
	}
	/*メインコンテンツとサイドコンテンツの幅*/
	.EntryContent main,
	.EntryContent aside {
		width: 100%;
		margin-left: 0%;
	}
}
@media screen and (min-width:992px){
	.sp-only {
		display: none !important;
	}
}


/* 2022-11-14 フルHD対応CSS */
@media screen and (min-width:1680px){
	#pc__global-2 > ul > li.pc__haschild > a{
		font-size: 15px;
		letter-spacing: 2px;
	}
	#pc__global-2 > ul > li{
		padding:0px 18px;
	}
	.GakumuNewsContainer,
	.PressReleaseContainer,
	.FeaturesContainer,
	.InfoContainer {
		/*max-width: 1680px;*/
		width:100%;
	}
	.FeaturesContent {
		width:100%;
	}
	#footermenu{
		padding:40px 110px;
	}
	#footermenu > .f-container{
		max-width:1500px;
		padding: 40px 0px 0px 0px;
	}
	footer .footerContainer {
		max-width:1500px;
	}
}

/* 2022-12-13 印刷対応CSS */
@media print {
    /* 背景表示 */
    body {
        -webkit-print-color-adjust: exact;
    }
    /* スマホメニュー非表示 */
    .quaternary.max1189px__show {
        display:none;
    }
    /* ヘッダー追従OFF */
    #GlobalHeader {
        position: inherit;
    }
    /* メインスライド印刷幅調整 */
    #MainSlider {
        width:100%;
    }
    /* PRESS RELEASE 印刷幅調整 */
    #PR-Slider .slick-track,
    #PR-Slider .slick-slide {
        width: 100% !important;
        transform: inherit !important;
    }
    #PR-Slider .slick-slide {
        display: none !important;
    }
    #PR-Slider .slick-slide:first-child {
        display: block !important;
        left: 0 !important;
        opacity: 1 !important;
    }
    /* フッターメニュー */
    #footermenu {
        font-size: 1rem;
    }
    #footermenu .pc-only {
        padding: 0px 90px 0px 90px;
    }
    #footermenu .sp-only {
        display:none;
    }
/*
    2023-08-31 印刷対応CSS追加
    ------------------------------------------------*/
    /* トップページ非表示 */
    #search-button,
    header .sp-only,
    #PR-Slider__SP,
    #EventsSlider__SP,
    #GN-Slider__SP,
    #FeaturesSlider__SP,
    .FeaturesPost.sp-only {
        display: none !important;
    }
    /* トップページ メニュー */
    #GlobalHeader {
        max-width: 100% !important;
    }
    #pc__global-2 > ul.Flex .pc__haschild {
        white-space: nowrap;
    }
    /* トップページ スライド */
    [class^="MS-Slide"] .slide-image {
        max-width: 100% !important;
    }
    /* トップページ コンテンツ */
    .GakumuNewsContainer, .PressReleaseContainer, .FeaturesContainer, .InfoContainer {
        max-width:1000px !important;
    }
    main .PressReleaseWrap, main .FeaturesWrap, main .InfoWrap {
        padding:80px 0px 0px;
    }
    #InfoSection article.News {
        padding: 0px 15px 0px 0px;
    }
    #InfoSection article.Events {
        padding: 0px 0px 0px 15px !important;
    }
    main .GakumuNewsWrap,
    main .DepartmentsWrap {
        padding: 0px;
    }
    /* トップページフッター */
    footer .footerContainer, #footermenu > .f-container {
        padding:40px 0px 0px 0px !important;
    }
    /* 下層ページ幅調整 */
    body.Pages {
        zoom:0.67;
    }
    .Entry .EntryContent {
        padding: 60px 24px;
    }
    .Entry .EntryContent.Flex {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    .Entry .EntryContent main,
    .Entry .EntryContent aside {
        width:100%;
        padding-left:0px;
    }
    .Entry .EntryContent aside {
        margin-top: 40px;
        margin-left:0px;
    }
    /* Safari */
    ::-webkit-full-page-media, :future, :root body.Top {
        zoom: 0.6;
    }
    p.pagetop {
        display: none !important;
    }
}


/* 2022-12-14 マテリアルアイコンCSS */
#pc__visitor-container #pc__visitor-trigger .material-symbols-outlined {
    font-size: 50px;
}
.material-symbols-outlined {
    font-size: 40px;
}


/* 2023-04-04 修正
---------------------------------------------------------------------------*/
/*ヘッダー*/
@media screen and (min-width: 1190px) {
    #pc__global-2 > ul > li {
        padding: 0px;
    }
    #pc__global-2 > ul > li.pc__haschild > a {
        font-size: 14px;
        letter-spacing: 1.5px;
    }
    #pc__global-1 a.menu-button {
        border: 1px solid #217FC4;
        border-radius: 3px;
        display: block;
        text-align: center;
        padding: 6px 10px;
        width: 124px;
        color: #217FC4;
        transition: all 0.2s ease-in-out;
    }
    #pc__global-1 .Flex a.menu-button .material-icons-outlined {
        transition: all 0.2s ease-in-out;
    }
    #pc__global-1 .Flex > li.has-button + li.has-button {
        margin-left: 10px;
    }
    #pc__global-1 .Flex a.menu-button.bgc_blue .material-icons-outlined {
        color: white;
    }
    #pc__global-1 .Flex a.menu-button.bgc_blue {
        color: white;
        background-color: #217FC4;
    }
    #pc__global-1 .Flex a.menu-button.bgc_blue:hover .material-icons-outlined {
        color: #217FC4;
    }
    #pc__global-1 .Flex a.menu-button.bgc_blue:hover {
        color: #217FC4;
        background-color: white;
    }
    #pc__global-1 .Flex a.menu-button.bgc_white:hover .material-icons-outlined {
        color: white;
    }
    #pc__global-1 .Flex a.menu-button.bgc_white:hover {
        color: white;
        background-color: #217FC4;
    }
}

/*ex-font1*/
html body .ex-font1 {
    font-family: 游明朝,YuMincho,"Hiragino Mincho ProN W3","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN",HG明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
}

/*PC Visitorメニュー*/
nav#pc__visitor > .Flex {
    font-size: inherit;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
}
nav#pc__visitor > .Flex > div {
    border-right: 1px solid #DAECFF;
}
nav#pc__visitor > .Flex > div:last-child {
    border-right: none;
}
div#pc__visitor-container #pc__visitor {
    text-align: left;
    height: auto;
}
nav#pc__visitor ul,
nav#pc__visitor li {
    margin: 0px;
    padding: 0px;
}
nav#pc__visitor .v_primary {
    width: 377px;
    padding-right: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
}
nav#pc__visitor .v_primary img {
    margin: 5px 0px 10px 0px;
    width: 100%;
}
nav#pc__visitor .v_primary h2 {
    font-weight: 500;
    line-height: 140%;
    margin-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 20px;
    position: relative;
}
nav#pc__visitor .v_primary h2:after,
nav#pc__visitor .v_primary h2:before {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    bottom: -5px;
    left: 0px;
    background-color: #F4F4F6;
}
nav#pc__visitor .v_primary h2:after {
    background-color: #50647C;
    width: 152px;
}
nav#pc__visitor li {
    padding-left: 15px;
    line-height: 100%;
    margin-bottom: 10px;
}
nav#pc__visitor li > ul > li {
    margin-left: -15px;
}
nav#pc__visitor li > a {
    font-size: 14px;
    position: relative;
    line-height: 140%;
}
nav#pc__visitor li > a:before {
    position: absolute;
    font-family: "Material Icons";
    content: "\eac9";
    color: #217FC4;
    top: -2px;
    left: -15px;
}
nav#pc__visitor li > ul > li > a:before,
nav#pc__visitor .v_primary > ul:nth-of-type(2) > li > a:before {
    content: "\e5cc";
}
nav#pc__visitor .v_primary > ul:nth-of-type(2) {
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}
nav#pc__visitor .v_primary > ul:nth-of-type(2) > li {
    width: 50%;
}
nav#pc__visitor .v_primary > ul:nth-of-type(2) > li:nth-of-type(odd) {
    padding-right: 10px;
}
nav#pc__visitor .v_secondary,
nav#pc__visitor .v_tertiary {
    padding: 5px 15px;
}
nav#pc__visitor .v_secondary > ul > li > a,
nav#pc__visitor .v_tertiary > ul > li > a {
    display: block;
    margin-bottom: 18px;
}


/*スライド*/
div#MainSlider-Container {
    position: relative;
}
div#MainSlider-Container .SNS-Vertical {
    position: absolute;
    bottom: 0px;
    right: 0px;
}

/*プレスリリース*/
main .PressReleaseWrap {
    padding-top: 100px;
    padding-bottom: 40px;
}
.PressRelease h1 > span {
    line-height: 100%;
}
.PressRelease h1 > span:before {
    top: 0px;
}
.PR-Image {
    border-bottom: 0px;
    height: 240px;
}
.PR-Publish {
    padding-bottom: 14px;
    margin-bottom: 8px;
}
.PR-Publish:after {
    content: none;
}
.PR-Publish > span {
    position: relative;
}
.PR-Publish > span:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    bottom: -12px;
    left: 0px;
    background-color: white;
}
.PR-Post > a {
    display: block;
    background-color: #003973;
    transition: background-color 0.2s ease-in-out;
    padding-bottom: 50px;
    height:100%;
}
.PR-Post > a:hover {
    background-color: #217FC4;
}
.PR-Post > a:after {
    position: absolute;
    font-family: "Material Icons";
    content: "\e8e4";
    display: block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background-color: #217FC4;
    right: 0px;
    bottom: 0px;
    transition: background-color 0.2s ease-in-out;
}
.PR-Post > a:hover:after {
    background-color: #003973;
}
.PR-Title h2,
.PR-Post > a {
    color: white;
}
.PR-Title h2 {
    font-weight: bold;
    padding-bottom: 0px;
}
.PR-Post > a:hover .PR-Image img {
    transform: translateX(-50%);
}
@media only screen and (max-width:991px) {
    main .PressReleaseWrap {
        padding-top: 70px;
        padding-bottom: 40px;
    }
}

/*SNS-LINK*/
ul.SNS-Link > li,
ul.SNS-Link {
    list-style: none;
    margin: 0px;
    padding: 0px;
}
ul.SNS-Link > li {
    width: 40px;
    height: 34px;
    overflow: hidden;
}
ul.SNS-Link > li > a {
    display: block;
    width: 100%;
    height: 100%;
    padding-top: 32px;/*上下borderの太さを考慮*/
    position: relative;
    background-color: #217FC4;
    border: 1px solid #7BAAD9;
    text-decoration: none;
    transition: background-color 0.2s ease-in-out;
}
ul.SNS-Link > li > a:hover {
    background-color: white;
}
ul.SNS-Link > li:not(:first-child) > a {
    border-top: none;
}
ul.SNS-Link > li > a:before {
    position: absolute;
    font-family: "Font Awesome 5 Brands";
    font-weight: 400;
    font-size: 15px;
    content: "\f39e";
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: white;
    transition: color 0.2s ease-in-out;
}
ul.SNS-Link > li > a:hover:before {
    color: #217FC4;
}
ul.SNS-Link > li.link-facebook > a:before {
    content: "\f39e";
}
ul.SNS-Link > li.link-twitter > a:before {
    /* content: "\f099"; */
    /* twitter --> X */
    font-family: "Font Awesome 6 Brands";
    content: "\e61b";
    font-size: 17px
}
ul.SNS-Link > li.link-youtube > a:before {
    content: "\f167";
    font-size: 18px
}
ul.SNS-Link > li.link-instagram > a:before {
    content: "\f16d";
    font-size: 20px;
}
ul.SNS-Link > li.link-spotify > a:before {
    content: "\f1bc";
    font-size: 17px
}
/*SNS-LINK gray*/
.gray > ul.SNS-Link > li > a {
    border: none !important;
    background-color: transparent;
}
.gray ul.SNS-Link > li > a:before {
    color: #CCCCCC;
}
.gray > ul.SNS-Link > li > a:hover:before {
    color: #217FC4;
}
/*SNS-LINK Horizontal*/
.SNS-Horizontal ul.SNS-Link {
    display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
    -ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}
.SNS-Horizontal ul.SNS-Link > li > a {
    border-bottom: none;
    border-right: 1px solid #7BAAD9;
}
.SNS-Horizontal ul.SNS-Link > li:last-child > a {
    border-right: none;
}

/*InfoSection*/
div#InfoSection {
    background-image: none;
    background-color: #F4F4F6;
}
.InfoContainer {
    background-color: transparent;
}
.News {
    width: 50%;
    padding: 0px 25px 0px 0px;
    position: relative;
}
article.Events {
    width: 50%;
    padding: 0px 0px 0px 25px;
}
.News h1,
.Events h1 {
    font-weight: bold;
    font-size: 36px;
}
main .InfoWrap {
    padding-top: 0px;
}
/*InfoSection News SNS*/
.News h1 {
    border-bottom: none;
    padding: 0px;
}
.News .SNS-Horizontal {
    position: absolute;
    right: 25px;
    top: 20px;
}
/*InfoSection News Post*/
.News .Post {
    background-color: white;
    padding: 10px;
    margin: 0px;
}
.News > .Post:nth-of-type(1) {
    margin-top: 30px;
    border-top: 2px solid #003973;
}
/*InfoSection News Post Content*/
.News > .Post .Thumbnail {
    position: relative;
    height: auto;
    width: auto;
    min-height: 110px;
    min-width: 110px;
    max-height: none;
    max-width: none;
    overflow: hidden;
}
.News > .Post > .Flex {
    display: block;
}
.News > .Post > .Flex > .Flex {
    margin-bottom: 5px;
}
.News .Publish {
    color: #999999;
    font-size: 14px;
}
/*InfoSection Events Navi*/
.Events div#EventsSlider {
    padding-top: 0px;
}
.Events div#EventsSlider .slick-dots {
    width: 114px;
    top: -65px;
    right: 120px;
}
.Events div#EventsSlider .slick-dots > li:not(:first-child) {
    margin-left: 10px;
}
.Events div#EventsSlider .slick-slide {
  	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
    -ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}
.Events div#EventsSlider .slick-slide > article {
    width: 50%;
    position: relative;
}
.Events div#EventsSlider .slick-slide > article:nth-of-type(1) {
    padding-right: 2.5px;
}
.Events div#EventsSlider .slick-slide > article:nth-of-type(2) {
    padding-left: 2.5px;
}
/*InfoSection Events Post*/
.Events .ES-Post > a {
    display: block;
    width: 100%;
    position: relative;
}
.Events .ES-Post > a:before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    background-color: rgba(0,0,0,0.5);
    z-index: 1;
}
.Events .ES-Post > a:hover {
    opacity: 1;
}
.Events .ES-Image {
    position: relative;
    display: block;
    width: 100%;
    max-width: 279px;
    height: 394px;
    overflow: hidden
}
.Events .ES-Image img {
    position: absolute;
    display: block;
    width: auto;
    height: auto;
/*
    min-width: 100%;
    min-height: 100%;
    max-width: none;
*/
    max-width: 100%;
    max-height: 393px;
    left: 0%;
    top: 50%;
    transform: translate(0%,-50%);
}
.Events .ES-Texts {
    position: absolute;
    z-index: 2;
    top: 30%;
    left: 0px;
    color: white;
    padding: 15px;
}
.Events .ES-Texts .ES-Publish {
    padding: 0px;
    font-size: 18px;
    display: inline-block;
    padding-bottom: 12px;
    border-bottom: 4px solid white;
}
.Events .ES-Texts .ES-Title h2 {
    font-size: 20px;
    line-height: 160%;
    margin-top: 3px;
}
.Events .ES-Texts,
.Events .ES-Post > a:before {
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}
.Events .ES-Post > a:hover .ES-Texts,
.Events .ES-Post > a:hover:before {
    opacity: 1;
}
/*InfoSection サイズ調整*/
@media only screen and (min-width:1000px) {
    .News .MoreButton,
    .Events .MoreButton {
        background-color: transparent !important;
    } 
}
@media only screen and (max-width:991px) {
    .News,
    article.Events {
        width: 100%;
        padding: 0px
    }
    .News h1,
    .Events h1 {
        font-weight: bold;
        font-size: 36px;
    }
    .News .MoreButton,
    .Events .MoreButton {
        background-color: white !important;
    } 
}
@media screen and (max-width:991px) {
    article.Events {
        margin-top: 40px;
    }
    .InfoWrap.Flex {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .Events div#EventsSlider .slick-slide > article {
        padding: 0px !important;
        width: 100%;
        margin-bottom: 10px;
    }
    .Events div#EventsSlider .slick-dots {
        top: -30px;
        right: 50%;
        transform: translateX(50%);
        width: 200px
    }
    .News .SNS-Horizontal {
        position: initial;
    }
}
@media only screen and (min-width:800px) {
    div#InfoSection {
        padding-bottom: 50px;
    }
}

/*FEATURES*/
article.FeaturesPost .Title h2 {
    font-weight: bold;
}
section#FeaturesSection {
    background-color: white;
    padding-top: 20px;
    padding-bottom: 40px;
    background-image: url(https://www-images.s.u-tokyo.ac.jp/ja/images/features-back.png);
    background-size: cover;
    background-position: right top;
    background-attachment: fixed;
}
section#FeaturesSection .FeaturesContainer {
    background-color: transparent;
}
.FeaturesWrap > h2 > span {
    font-weight: bold;
    font-size: 36px;
    position: relative;
}
.FeaturesWrap > h2 > span:before {
    position: relative;
    content: url(https://www-images.s.u-tokyo.ac.jp/ja/images/icon-2.png);
    vertical-align: middle;
    margin-right: 20px;
}
article.FeaturesPost .Title h2 {
    font-weight: bold;
}
@media only screen and (max-width:991px) {
    section#FeaturesSection .FeaturesWrap {
        padding-top: 50px;
        padding-bottom: 40px;
    }
    section#FeaturesSection {
        padding-top: 0px;
        padding-bottom: 0px;
    }
    section#FeaturesSection .MoreButton {
        margin-top: 15px;
        background-color: #f3f3f3;
    } 
}

/*GAKUMU NEWS*/
section#GakumuNewsSection {
    background-color: #ebf4fc;
    padding-top: 60px;
    padding-bottom: 60px;
}
section#GakumuNewsSection  .GakumuNewsContainer {
    background-color: transparent;
}
section#GakumuNewsSection .GakumuNews {
    background-color: white;
}
.GN-Container {
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
section#GakumuNewsSection .MoreButton {
    background-color: #217FC4;
    border: 1px solid #217FC4;
    width: 100px;
    height: 100px;
    padding: 65px 0px 0px 0px;
}
section#GakumuNewsSection a.MoreButton:after {
    content: none;
}
section#GakumuNewsSection .MoreIcon:before,
section#GakumuNewsSection .MoreIcon:after {
    background-color: white;
    transition: background-color 0.2s ease-in-out;
}
section#GakumuNewsSection .MoreButton span {
    color: white;
    transition: color 0.2s ease-in-out;
}
section#GakumuNewsSection a.MoreButton:hover {
    background-color: white;
}
section#GakumuNewsSection a.MoreButton:hover .MoreIcon:before,
section#GakumuNewsSection a.MoreButton:hover .MoreIcon:after {
    background-color: #217FC4;
}
section#GakumuNewsSection .MoreButton:hover span {
    color: #217FC4;
}
@media only screen and (max-width:1189px) {
    section#GakumuNewsSection {
        padding: 20px;
    }
    .GakumuNews {
        padding: 40px 20px;
    }
    section#GakumuNewsSection .MoreButton {
        width: 100%;
        padding-top: 60px
    }
}

/*Departments*/
#DepartmentsSection {
    background-image: url(https://www-images.s.u-tokyo.ac.jp/ja/images/departments-back.jpg);
    background-size: cover;
    background-position: right bottom;
    background-repeat: no-repeat;
    position: relative;
}
#DepartmentsSection:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background-color: rgba(0,57,114,0.4);
    left: 0px;
    top: 0px;
    z-index: 0;
}
.DepartmentsContainer {
    position: relative;
}
.Departments > h1 {
    font-size: 32px;
    font-weight: bold;
    text-align: center;
    color: white;
    margin-bottom: 30px;
}
.Departments .Flex.Dm-Row {
    -webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
    -ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}
.Departments .Flex.Dm-Row > .Dm-Item:not(:nth-of-type(3n)) {
    margin-right: 20px;
}
.Departments .Flex.Dm-Row > .Dm-Item {
    width: calc(33.3333% - 13.3333333px);
    background-color: white;
    margin: 10px 0px;
    border-radius: 7px;
    padding: 18px 16px 18px 13px;
}
.Departments .Dm-Item.Flex {
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
}
.Departments .Dm-Item-Img {
    width: 80px;
    height: 80px;
    margin-right: 10px;
}
.Departments .Dm-Item-Texts {
    width: calc(100% - 90px);
}
.Departments a {
    text-decoration: none !important;
    transition: color 0.2s ease-in-out;
}
.Departments .Parent {
    font-size: 15px;
    border-bottom: 1px solid #DDDDDD;
    margin-bottom: 5px;
}
.Departments ul,
.Departments li {
    margin: 0px;
    padding: 0px;
    list-style: none;
}
.Departments li a {
    font-size: 13px;
    line-height: 120%;
}
.Departments .Flex.Child {
     -ms-flex-wrap: wrap;
  	flex-wrap: wrap;
}
.Departments .Flex.Child li {
    width: 50%;
    line-height: 100%;
    margin-bottom: 5px;
    padding-left: 12px;
}
.Departments .Flex.Child li > a {
    position: relative;
    line-height: 100%;
}
.Departments .Flex.Child li > a:before {
    position: absolute;
    font-family: "Material Icons";
    content: "\e5cc";
    vertical-align: middle;
    top: 0px;
    left: -13px;
    font-size: 14px;
    font-weight: bold;
    color: #217FC4;
}
@media only screen and (min-width:800px) {
    .Departments .Flex.Child li {
        width: calc(50% - 10px);
    }
    .Departments .Flex.Child li:nth-of-type(odd) {
        margin-right: 5px;
    }
    .Departments .Flex.Child li:nth-of-type(even) {
        margin-left: 5px;
    }
}
@media only screen and (max-width:1189px) {
    .Departments .Flex.Dm-Row > .Dm-Item {
        width: calc(50% - 10px);
    }
    .Departments .Flex.Dm-Row > .Dm-Item:not(:nth-of-type(3n)) {
        margin-right: 0px;
    }
    .Departments .Flex.Dm-Row > .Dm-Item:not(:nth-of-type(2n)) {
        margin-right: 20px;
    }
}
@media only screen and (max-width:991px) {
    #DepartmentsSection {
        padding: 20px 20px;
    }
    .Departments > h1 {
        margin-bottom: 0px;
    }
    .Departments .Flex.Dm-Row > .Dm-Item {
        width: 100%;
    }
    .Departments .Flex.Dm-Row > .Dm-Item:not(:nth-of-type(2n)) {
        margin-right: 0px;
    }
}

/*Footer*/
@media only screen and (min-width: 800px) {
    div#footermenu nav > .Flex:not(:last-child) {
        padding: 25px 10px 10px 10px;
        border-top: 1px solid #555555;
    }
    div#footermenu nav > .Flex > ul > li.has-child > ul {
        margin-bottom: 15px;
    }
    div#footermenu nav > .Flex > ul > li.has-child > a {
        position: relative;
    }
    div#footermenu nav > .Flex > ul > li.has-child > ul a:hover {
        font-weight: bold;
    }
    div#footermenu nav > .Flex > ul > li.has-child > a:after {
        position: relative;
        font-family: "Material Icons";
        content: "\e145";
        vertical-align: middle;
        margin-left: 5px;
    }
    div#footermenu nav > .Flex > ul > li.has-child.active > a:after {
        content: "\e15b";
    }
    #footermenu {
        padding-bottom: 20px;
    }
    div#footermenu nav > .tertiary {
        padding: 25px 10px 5px 10px;
        border-top: 1px solid #555555;
    }
    div#footermenu nav > .tertiary > ul:first-child {
        margin-bottom: 10px;
    }
    div#footermenu nav > .tertiary > ul > li > a {
        padding: 0px 14px;
        font-size: 14px;
        border-right: 1px solid #555555;
        color: white;
        line-height: 100%;
    }
    div#footermenu nav > .tertiary > ul > li > a:hover {
        color: #CCCCCC;
    }
    div#footermenu nav > .tertiary > ul > li:first-child > a {
        padding-left: 0px;
    }
    div#footermenu nav > .tertiary > ul > li:last-child > a {
        border-right: none;
    }
    footer {
        border-top: none;
        padding-top: 0px;
    }
    footer .footerContainer {
        padding-top: 0px;
        padding-bottom: 0px;
    }
    footer .footerWrap {
        border-top: 1px solid #555555;
        padding-top: 50px;
        padding-bottom: 50px;
    }
    footer .footerContainer,
    #footermenu > .f-container {
        max-width: 1360px;
        padding-left: 90px;
        padding-right: 90px;
    }
    #footermenu {
        padding: 20px;
    }
}
@media screen and (max-width:1189px) {
    div#footermenu nav .Flex {
        -ms-flex-wrap: wrap;
      	flex-wrap: wrap;
    }
    div#footermenu nav .Flex > ul {
        width: 33.3333%;
    }
}
@media screen and (max-width:999px) {
    div#footermenu nav .Flex > ul {
        width: 50%;
    }
}
/*Footer submenu*/
#footermenu .has-child > ul {
    display: none;
}
/*Footer logo SNS Copyright*/
footer .SNS-Horizontal.gray > ul > li {
    margin-right: 5px;
    height: 36px;
    width: 36px;
}
footer .SNS-Horizontal.gray > ul {
    margin-right: 20px;
}
footer .SNS-Horizontal.gray > ul > li > a {
    background-color: #3B3B3B;
}
footer .SNS-Horizontal.gray > ul.SNS-Link > li > a:hover {
    background-color: #595959;
}
footer .SNS-Horizontal.gray > ul.SNS-Link > li > a:hover:before {
    color: white;
}
footer ul.SNS-Link > li.link-facebook > a:before {
    font-size: 18px;
}
footer ul.SNS-Link > li.link-twitter > a:before {
    font-size: 21px
}
footer ul.SNS-Link > li.link-youtube > a:before {
    font-size: 24px
}
footer ul.SNS-Link > li.link-instagram > a:before {
    font-size: 24px;
}
ul.SNS-Link > li.link-spotify > a:before {
    font-size: 22px
}
@media only screen and (max-width: 1189px) {
    .footerContainer .right.Flex {
        display: block;
    }
    footer .SNS-Horizontal.gray > ul > li:last-child {
        margin-right: 0px;
    }
    footer .SNS-Horizontal.gray > ul {
        margin-right: 0px;
        margin-bottom: 10px;
    }
}
@media only screen and (max-width: 1189px) {
    footer .SNS-Horizontal.gray > ul {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}

/*---------------------------------------------------
*
* 2023-04-18 以下スマホデザイン変更に伴う修正
*
---------------------------------------------------*/
/*タイトル*/
@media only screen and (max-width:991px) {
    .FeaturesWrap > h2 > span,
    .FeaturesWrap > h2,
    .Events h1,
    .News h1,
    .PressRelease h1 {
        font-size: 28px;
    }
    .Departments > h1 {
        font-size: 26px;
        font-weight: 500;
    }
    .Events h1 {
        text-align: center;
    }
}

/*プレスリリース*/
.PressRelease h1 > span:before {
    content: "";
    display: inline-block;
    width: 40px;
    height: 55px;
    background-image: url(https://www-images.s.u-tokyo.ac.jp/ja/images/icon-1.png);
    background-size: contain;
}
#PR-Slider__SP  {
    padding-top: 80px;
}
#PR-Slider__SP  .slick-prev,
#PR-Slider__SP  .slick-next {
    top: 10px;
    right: 0px;
    left: auto;
    transform: scale(0.85,0.85);
}
#PR-Slider__SP  .slick-prev {
    right: 45px;
}
#PR-Slider__SP  .slick-prev::after,
#PR-Slider__SP  .slick-next::after {
    content: "\e941";
    color: #afafaf;
    background-color: white;
    border: 1px solid #afafaf;
    transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}
#PR-Slider__SP  .slick-prev::after {
    transform: rotate(180deg);
}
#PR-Slider__SP  .slick-next::after {
    transform: none;
}
#PR-Slider__SP  .slick-prev.active:after,
#PR-Slider__SP  .slick-next.active:after,
#PR-Slider__SP  .slick-prev:hover:after,
#PR-Slider__SP  .slick-next:hover:after {
    color: #2e87c7;
    border-color: #2e87c7;
}
#PR-Slider__SP  .slick-dots {
    top: 22px;
    bottom: auto;
    line-height: 0%;
    width: calc(100% - 100px);
    left: 0px;
    text-align: left;
}
#PR-Slider__SP  .slick-dots li {
    position: relative;
    margin: 6px;
}
#PR-Slider__SP  .slick-dots li button {
    background-color: #dddddd;
}
#PR-Slider__SP  .slick-dots li.slick-active button {
    background-color: #217fc4;
}
#PR-Slider__SP .PR-Post {
    margin-bottom: 0px !important;
    padding: 10px;
    filter: none;
}
#PR-Slider__SP .PR-Post > a {
    filter: drop-shadow(0px 0px 4px rgba(0,0,0,0.45));
}
@media screen and (max-width: 991px) {
    #PressReleaseSection a.MoreButton {
        background-color: transparent;
    }
}

/*ニュース*/
@media screen and (max-width: 991px) {
    .News h1 {
        text-align: center;
    }
    .News .SNS-Horizontal ul.SNS-Link {
        -webkit-box-pack: center;
    	-ms-flex-pack: center;
    	justify-content: center;
    }
    .News > .Post .Thumbnail {
        height: auto;
        width: auto;
        min-height: 60px;
        min-width: 60px;
        max-height: 60px;
        max-width: 60px;
    }
}

/*イベント*/
@media screen and (max-width: 991px) {
    .Events .slick-list.draggable {
        background:#fff;
    }
    .Events .ES-Post > a:before {
        background-color: transparent;
    }
    .Events .ES-Texts {
        position: static;
        opacity: 1;
        background-color: white;
        color: #212121
    }
    .Events a  {
        text-decoration: none;
    }
    .Events .MoreButton {
        border-top: 1px solid #efefef;
    }
    .Events .ES-Texts .ES-Publish {
        display: inline-block;
        border-bottom: 5px solid #003973;
        padding-bottom: 9px;
        margin: 10px 0px 10px 0px;
    }
    .Events .ES-Image {
        height: auto;
        max-width: 100%;
        display: flex;
        justify-content: center;
    }
    .Events .ES-Image img {
        position: static;
        display: block;
        width: 100%;
        height: auto;
        min-width: 100%;
        min-height: auto;
        max-width: none;
        max-height: none;
        left: 0;
        top: 0;
        transform: none;
    }
}
div#EventsSlider__SP {
    padding-top: 12px;
}
div#EventsSlider__SP .slick-dots {
    top: -27px;
    bottom: auto;
    text-align: left;
}
div#EventsSlider__SP .slick-dots li {
    margin: 6px;
}
div#EventsSlider__SP .slick-dots li:nth-of-type(2) {
    margin: 0px 1.5%;
}
div#EventsSlider__SP .slick-dots li button {
    background-color: #dddddd;
}
div#EventsSlider__SP .slick-dots li.slick-active button {
    background-color: #217fc4;
}
#SP_ES-Slide__NextArrow,
#SP_ES-Slide__PrevArrow {
    top: -40px;
    transform: scale(0.85,0.85);
}
#SP_ES-Slide__PrevArrow {
    right: 50px;
    left: auto;
}
#SP_ES-Slide__NextArrow:after,
#SP_ES-Slide__PrevArrow:after {
    content: "\e941";
    color: white;
    background-color: #afafaf;
    border: 1px solid #afafaf;
    transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}
#SP_ES-Slide__NextArrow.active:after,
#SP_ES-Slide__PrevArrow.active:after,
#SP_ES-Slide__NextArrow:hover:after,
#SP_ES-Slide__PrevArrow:hover:after {
    color: white;
    border-color: #2e87c7;
    background-color: #2e87c7
}
#SP_ES-Slide__NextArrow:after {
    transform: rotate(0deg);
}
#SP_ES-Slide__PrevArrow:after {
    transform: rotate(180deg);
}

/*FEATURES*/
@media screen and (max-width: 991px) {
    .FeaturesWrap > h2 {
        margin-left: -52px;
        margin-bottom: 30px;
    }

    .FeaturesWrap > p {
        display: none;
    }
    section#FeaturesSection .MoreButton {
        margin-top: 0px;
        background-color: white;
    }
    #FeaturesSlider__SP + .FeaturesPost a,
    #FeaturesSlider__SP a {
        background-color: white;
        border-bottom: 1px solid #cccccc;
        margin-bottom: 10px;
    }
    #FeaturesSlider__SP + .FeaturesPost a {
        margin-bottom: 0px;
    }
}
article#FeaturesSlider__SP {
    margin-top: 20px;
    padding-top: 15px;
}
article#FeaturesSlider__SP .slick-dots {
    top: -27px;
    bottom: auto;
    text-align: left;
}
article#FeaturesSlider__SP .slick-dots li {
    margin: 6px;
}
article#FeaturesSlider__SP .slick-dots li:nth-of-type(2) {
    margin: 0px 1.5%;
}
article#FeaturesSlider__SP .slick-dots li button {
    background-color: #dddddd;
}
article#FeaturesSlider__SP .slick-dots li.slick-active button {
    background-color: #217fc4;
}
#SP_FS-Slide__NextArrow,
#SP_FS-Slide__PrevArrow {
    top: -40px;
    transform: scale(0.85,0.85);
}
#SP_FS-Slide__PrevArrow {
    right: 50px;
    left: auto;
}
#SP_FS-Slide__NextArrow:after,
#SP_FS-Slide__PrevArrow:after {
    content: "\e941";
    color: white;
    background-color: #afafaf;
    border: 1px solid #afafaf;
    transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}
#SP_FS-Slide__NextArrow.active:after,
#SP_FS-Slide__PrevArrow.active:after,
#SP_FS-Slide__NextArrow:hover:after,
#SP_FS-Slide__PrevArrow:hover:after {
    color: white;
    border-color: #2e87c7;
    background-color: #2e87c7
}
#SP_FS-Slide__NextArrow:after {
    transform: rotate(0deg);
}
#SP_FS-Slide__PrevArrow:after {
    transform: rotate(180deg);
}

/*DEPARTMENTS*/
@media screen and (max-width: 991px) { 
    #DepartmentsSection .Departments .Flex.Dm-Row {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    #DepartmentsSection .Departments .Flex.Dm-Row > .Dm-Item {
        width: calc(50% - 1px);
        margin: 2px 0px 0px 0px;
        border-radius: 0px;
        padding: 20px 10px;
    }
    #DepartmentsSection .Departments .Dm-Item-Img {
        width: 50px;
    }
    #DepartmentsSection .Departments .Flex.Child {
        padding-top: 25px;
    }
    #DepartmentsSection .Departments .Flex.Child li {
        width: calc(100% + 50px);
        margin-left: -50px
    }
    #DepartmentsSection .Departments .Dm-Item-Texts {
        width: calc(100% - 60px);
    }
    #DepartmentsSection .Departments .Parent {
        line-height: 200%;
        top: 10px;
        position: relative;
    }
    #DepartmentsSection .Departments .Parent a {
        font-size: 13px;
    }
    #DepartmentsSection .Departments > h1 {
        margin-bottom: 20px;
        margin-top: 10px;
    }
}

/*学務ニュース*/
@media screen and (max-width: 1189px) {
    .GakumuNews {
        padding: 0px;
        padding-top: 30px;
        padding-bottom: 20px;
    }
    #GN-Slider a.Flex,
    #GN-Slider__SP a.Flex {
      	display:-webkit-box;
      	display:-ms-flexbox;
      	display:flex;
    	-webkit-box-align: start;
    	-ms-flex-align: start;
    	align-items: flex-start;
    }
    section#GakumuNewsSection .GakumuNews {
        background-color: transparent;
    }
    section#GakumuNewsSection .GN-Image {
        width: 100px;
        height: 100px;
        margin-top: 5px;
    }
    section#GakumuNewsSection .GN-Texts {
        width: calc(100% - 100px);
        max-width: calc(100% - 115px);
        margin-left: 15px;
        line-height: 170%;
    }
    div#GN-Slider,
    div#GN-Slider__SP {
        padding-top: 55px;
    }
    div#GN-Slider .slick-dots,
    div#GN-Slider__SP .slick-dots {
        top: 0px;
        bottom: auto;
        text-align: left;
        padding-left: 35px;
    }
    div#GN-Slider .slick-dots li,
    div#GN-Slider__SP .slick-dots li {
        margin: 6px;
    }
    div#GN-Slider .slick-dots li:nth-of-type(2),
    div#GN-Slider__SP .slick-dots li:nth-of-type(2) {
        margin: 0px 1.5%;
    }
    div#GN-Slider .slick-dots li button,
    div#GN-Slider__SP .slick-dots li button {
        background-color: #dddddd;
        border-radius: 100%;
        width: 12px;
        height: 12px;
    }
    div#GN-Slider .slick-dots li.slick-active button,
    div#GN-Slider__SP .slick-dots li.slick-active button {
        background-color: #217fc4;
    }
    section#GakumuNewsSection #GN-Slide__NextArrow,
    section#GakumuNewsSection #GN-Slide__PrevArrow {
        top: -12px;
        transform: scale(0.8,0.8);
        left: auto;
    }
    section#GakumuNewsSection #GN-Slide__PrevArrow {
        right: 70px;
    }
    section#GakumuNewsSection #GN-Slide__NextArrow {
        right: 25px;
    }
    #GN-Slide__NextArrow:after,
    #GN-Slide__PrevArrow:after {
        content: "\e941";
        color: white;
        background-color: #afafaf;
        border: 1px solid #afafaf;
        transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
    }
    #GN-Slide__NextArrow.active:after,
    #GN-Slide__PrevArrow.active:after,
    #GN-Slide__NextArrow:hover:after,
    #GN-Slide__PrevArrow:hover:after {
        color: white;
        border-color: #2e87c7;
        background-color: #2e87c7
    }
    #GN-Slide__NextArrow:after {
        transform: rotate(0deg);
    }
    #GN-Slide__PrevArrow:after {
        transform: rotate(180deg);
    }
    section#GakumuNewsSection .MoreButton {
        height: 80px;
        padding-top: 48px;
    }
}
/*footer*/
div#footermenu nav > .Flex:not(:last-child) {
    padding: 25px 10px 10px 10px;
    border-top: 1px solid #555555;
}
div#footermenu nav > .Flex > ul > li.has-child > ul {
    margin-bottom: 15px;
}
div#footermenu nav > .Flex > ul > li.has-child > a {
    position: relative;
}
div#footermenu nav > .Flex > ul > li.has-child > ul a:hover {
    font-weight: bold;
}
div#footermenu nav > .Flex > ul > li.has-child > a:after {
    position: relative;
    font-family: "Material Icons";
    content: "\e145";
    vertical-align: middle;
    margin-left: 5px;
}
div#footermenu nav > .Flex > ul > li.has-child.active > a:after {
    content: "\e15b";
}
#footermenu {
    padding-bottom: 20px;
}
div#footermenu nav > .tertiary {
    padding: 25px 10px 5px 10px;
    border-top: 1px solid #555555;
}
div#footermenu nav > .tertiary > ul:first-child {
    margin-bottom: 10px;
}
div#footermenu nav > .tertiary > ul > li > a {
    padding: 0px 14px;
    font-size: 14px;
    border-right: 1px solid #555555;
    color: white;
    line-height: 100%;
}
div#footermenu nav > .tertiary > ul > li > a:hover {
    color: #CCCCCC;
}
div#footermenu nav > .tertiary > ul > li:first-child > a {
    padding-left: 0px;
}
div#footermenu nav > .tertiary > ul > li:last-child > a {
    border-right: none;
}
footer {
    border-top: none;
    padding-top: 0px;
}
footer .footerContainer {
    padding-top: 0px;
    padding-bottom: 0px;
}
footer .footerWrap {
    border-top: 1px solid #555555;
    padding-top: 50px;
    padding-bottom: 50px;
}
footer .footerContainer,
#footermenu > .f-container {
    max-width: 1360px;
    padding-left: 90px;
    padding-right: 90px;
}
#footermenu {
    padding: 20px;
}
@media only screen and (max-width:991px) {
    footer .footerContainer, #footermenu > .f-container {
        padding-left: 0px;
        padding-right: 0px;
    }
}
@media only screen and (max-width:799px) {
    #footermenu {
        font-size: 14px;
    }
    div#footermenu nav > .Flex {
        border: none !important;
        padding: 0px !important;
    }
    div#footermenu nav .Flex > ul {
        width: 100%;
    }
    div#footermenu nav .Flex > ul > li > a {
        text-align: center;
        display: block;
        padding: 12px 25px;
        border-top: 1px solid #555555;
        margin: 0px;
    }
    div#footermenu nav > .Flex > ul > li.has-child > a:after {
        position: absolute;
        right: 10px;
    }
    div#footermenu nav .Flex > ul {
        padding-right: 0px;
    }
}



/*---------------------------------------------------
*
* 2023-04-27 tableタグの修正 , aタグの修正 , PhotoFrameクラスの追加
*
---------------------------------------------------*/
/*table*/
.Entry main th, .Entry main td {
    white-space: inherit;
}
@media only screen and (max-width:991px) {
    .Entry table {
        display: block;
        max-width: 100%;
        overflow-X: scroll;
    }
    .Entry main th, .Entry main td {
        white-space: nowrap;
    }
}
/*aタグ*/
.Entry a {
    word-break: break-word;
}
/*PhotoFrameクラス*/
.Entry .PhotoFrame {
    padding: 8px; 
    background-color: white; 
    box-shadow: 0 0 7px rgba(136,136,136,0.4);
}

/*---------------------------------------------------
*
* 2023-05-02 画像中央タグ追加
*
---------------------------------------------------*/
/*画像中央寄せ*/
.Entry main .eFloat-c {
	margin: 0px auto 20px !important;
}
/*動画*/
.movies {
    max-width: 560px !important;
    width: 100%;
    aspect-ratio: 16 / 9;
}
.movies iframe {
    width: 100%;
    height: 100%;
}

/*---------------------------------------------------
*
* 2023-05-16 サイドメニュー用 hidden_child クラス
*
---------------------------------------------------*/
aside .hidden_child > ul {
    display: none !important;
}
aside .hidden_child > ul {
    display: none !important;
}
aside .hidden_child > a:after {
    content: "\e5cc" !important;
    transform: none !important;
    color: #777777 !important
}

/*---------------------------------------------------
*
* 2023-06-08 ScrollInfoクラスの実装
*
---------------------------------------------------*/
.ScrollInfo {
    max-height: 300px;
    overflow-y: auto;
    padding: 10px;
    box-shadow:0px 0px 5px 0px #efefef inset;
}
.ScrollInfo > article {
    /* padding: 25px 0px; */
    /* border-top: 1px solid #f0f0f0; */
    padding: 12px 5px 15px;
    border-bottom: 1px solid #f0f0f0;
}
/*
.ScrollInfo > article:last-child {
    border-bottom: 1px solid #f0f0f0;
}
*/
.ScrollInfo > article > span {
    /* padding: 4px 15px 5px; */
    padding: 4px 10px;
    background-color: #003973;
    color: white;
    /* font-size: 12px; */
    font-size: 11px;
    font-weight: bold;
}
.ScrollInfo > article > h3{
    margin: 5px 0px 0px 0px;
    padding: 0px;
    border: none;
    font-size: 14px;
}
.ScrollInfo > article > h3:before {
    content: none;
}

/*---------------------------------------------------
*
* 2023-06-15 new-icon,red-boxクラスの実装
*
---------------------------------------------------*/
.new-icon {
    background-color: #f00;
    color: white;
    margin: 5px;
    padding: 1px 5px 2px 5px;
    font-size: 15px;
    display: inline-block;
    line-height: 12px;
    position: relative;
    top: -1px;
}
.red-box {
    padding: 15px;
    border: 1px solid #f00;
}

/*---------------------------------------------------
*
* 2023-06-09 SPメニュー
*
---------------------------------------------------*/
.sp-delimiter {
    color:#fff;
    font-weight:normal;
    border-bottom:1px solid #fff;
    padding:20px 0px 10px !important;
    margin-bottom:10px;
}
/*---------------------------------------------------
*
* 2023-06-09 スライドテキスト、PC訪問者別メニュー、スマホ多言語
*
---------------------------------------------------*/
[class^="MS-Slide"] {
    position: relative;
}
.slider-text {
    position: absolute;
    display: block;
    background-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.5),rgba(0, 0, 0, 0.9));
    left:0px;
    bottom:0px;
    padding: 80px 80px 120px;
    width:100%;
}
@media screen and (max-width:991px){
    .slider-text {
        padding: 80px 35px 80px 10px;
    }
}
.slider-text a{
    text-decoration: none;
    position: relative;
    padding: 20px 30px 20px 0px;
    width: 100%;
    display: block;
    border-bottom: 1px solid #bbb;
}
@media screen and (max-width:991px){
    .slider-text a{
        padding: 20px 25px 20px 0px;
    }
}
.slider-text a span {
    position: relative;
    font-family: 'Noto Sans Cypro Minoan','URW Gothic', Avenir, 'Avenir Next LT Pro', Montserrat, Corbel, source-sans-pro, YuGothic,"ヒラギノ角ゴ ProN W3",Hiragino Kaku Gothic ProN,Arial,"メイリオ",Meiryo,sans-serif;	/*フォント種類*/
    font-weight: 100;
    letter-spacing: 0.08em;
    color:#fff;
    font-size:1.4em;
    opacity: 1;
    line-height: 1.4;
    display: inline-block;
    padding-left:30px;
    transition: 0.3s;
}
@media screen and (max-width:991px){
    .slider-text a span {
        font-size:1.1em;
        letter-spacing: 0em;
        padding-left:20px;
    }
}
.slider-text a:hover span{
    color: #bbb;
}
.slider-text a:before {
    position: absolute;
    content: "";
    background:#2584c8;
    width:6px;
    height:86%;
    left:0px;
    top: 7% ;
    transition:0.3s;
}

.slider-text a:after {
    position: absolute;
    content: "";
    background-color: #fff;
    display: inline-block;
    height: 2em;
    width: 2em;
    -webkit-mask: url("svg/arrow-right.svg");
    mask: url("svg/arrow-right.svg");
    vertical-align: middle;
    font-weight: 100;
    font-size:20px;
    right:0px;
    top: calc(50% - 22px);
    line-height:0;
    transition:0.3s;
}

.slider-text a:hover:after {
    background-color:#bbb;
}

div#pc__visitor-container #pc__visitor{
    background-color: #003973;
}
div#pc__visitor-container #pc__visitor div{
    display: flex;
    flex-wrap: wrap;
}
div#pc__visitor-container #pc__visitor div div a{
    width:126px;
    height: 126px;
    display: inline-grid;
    margin:0px;
    text-align: center;
    color:#fff;
    font-size:13px;
    font-weight: normal;
    line-height:1;
    transition: 0.3s;
    z-index: 999;
}
div#pc__visitor-container #pc__visitor div div a{
  font-variation-settings:
  'FILL' 0,
  'wght' 200,
  'GRAD' 0,
  'opsz' 40
}

div#pc__visitor-container #pc__visitor div div {
    text-align: center;
    position: relative;
    border: solid 1px #9daab3;
    margin:6px;
}
div#pc__visitor-container #pc__visitor div div:hover {
    background-color: #fff;
}
div#pc__visitor-container #pc__visitor div div::before,
div#pc__visitor-container #pc__visitor div div::after {
	position: absolute;
	content: "";
	display: block;
	background-color: #003973;
    
}
div#pc__visitor-container #pc__visitor div div::before {
	top: -2px;
	bottom: -2px;
	left: 6px;
	right: 6px;
}

div#pc__visitor-container #pc__visitor div div::after {
	top: 6px;
	bottom: 6px;
	left: -2px;
	right: -2px;
}
div#pc__visitor-container #pc__visitor div div:hover::before,
div#pc__visitor-container #pc__visitor div div:hover::after {
	display:none;
}
div#pc__visitor-container #pc__visitor div a{
    transition: 0.3s;
}
div#pc__visitor-container #pc__visitor div a:hover{
    background:#fff;
    color:#003973;
    font-weight: bold;
}
div#pc__visitor-container #pc__visitor div a span{
    margin-top:30px;
    margin-bottom:-50px;
}

header .sp-language{
    color:#003973;
    font-size:12px;
    float:right;
    display: flex;
    flex-wrap: nowrap;
    align-items:center;
    height:50px;
}
header .sp-language span.material-symbols-outlined{
    font-size:16px;
    margin-right:3px;  
}

.Entry .Meta .Publish{
    color:#333;
    font-weight:100;
}


/*---------------------------------------------------
*
* 2023-08-01 PCメニュー右端の途切れ対策
*
---------------------------------------------------*/
#pc__global-2 .pcg-left .pc__has-grandchild > .pc__grandchild {
    left: auto;
    right: 100%;
}

/* 20240110 ORSDトップページ改修 */

div.orsdIndexArea {
	margin-bottom: 3em;
	background: #eee;
	padding:0.5em;
}

div.orsdIndexArea div.item {
	display: inline-block;
	width: 50%;
	padding:0.5em;
	vertical-align: top;
}

div.orsdIndexArea div.item img {
	margin: 0;
}

div.orsdIndexArea div.item span {
	display: block;
	text-align: center;
	font-weight: bold;
	margin-top: 0.3em;
}

@media screen and (min-width:480px) {

	div.orsdIndexArea div.item {
		width: 25%;
	}

}