@charset "utf-8";
html, body {
    font-family: "メイリオ", Meiryo, "ヒラギノ丸ゴ Pro W4", "Hiragino Maru Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 100%;
    line-height: 1.7;
    color: #000;
}
/*----- その他基本設定 -----*/
/*表示しない*/
.hidden {
    display: none;
}
ul {
    list-style: none;
}
/*外部リンクアイコン*/
.icon {
    display: inline;
    vertical-align: -2px;
    margin: 0 2px;
}
.icon-hidden .icon {
    display: none;
}
/*画像*/
img {
    max-width: 100%;
    vertical-align: top;
    border: 0;
}
/*カラー*/

:root {
 --red: #c7000a;
 --green: #1db735;
 --blue: #35a5cb;
 --yellow: #c2ba00;
 --orange: #dc7b36;
}
/* リンク */
.naiyo p {
    margin-top: 10px;
}
/* アンカー */
.anchor {
    padding-top: 125px;
    margin-top: -125px;
}

@media (max-width: 991px) {
.anchor {
    padding-top: 80px;
    margin-top: -80px;
}
}
/*ヘッダー
--------------------------------------------------*/

.header-container-pc {
    width: 100%;
    position: fixed;
    top: 0;
    background: rgba(255,255,255,0.9);
    z-index: 50;
    box-shadow: 5px 7px 10px rgba(0,0,0,.3);
}
.header-up {
    display: flex;
    justify-content: space-between;
    margin: 15px 20px 10px;
}
.tut-logo img {
    width: 180px;
}
.header-inner {
    display: flex;
    align-items: center;
}
.center-title {
    margin-right: 20px;
}
.center-title a {
    font-size: 1.5rem;
    color: #000;
    font-weight: bold;
    text-decoration: none;
    display: flex;
    align-items: flex-start;
}
.en .center-title a {
    font-size: 1.2rem;
}
.center-title a div {
    margin: 0 5px;
    line-height: 1.8;
}
.en .center-title a div {
    margin: 0 5px;
    line-height: 2.2;
}
.center-logo {
    width: 35px;
}
.btn-lang a {
    color: #fff;
    text-decoration: none;
    background: #000;
    display: inline-block;
    padding: 4px 10px 2px 35px;
    background-image: url(../imgs/common/btn_icon_lang.png);
    background-size: 20px;
    background-position: center left 10px;
    background-repeat: no-repeat;
    margin: 0 10px;
}
.btn-lang a:hover {
    opacity: 0.8;
}
.sitesearch {
    display: flex;
}
.searcharea {
    border: 2px solid #000;/*width: 165px;*/
}
.searcharea input {
    border: none;
    padding: 1px 5px;
    width: 165px;
}
.searcharea input:focus {
    border: none;
}
.searchbtn {
    background: #000;
    padding: 4px 6px;
}
.searchbtn input {
    width: 20px;
}
.header-nav {
    padding: 10px 20px;
    background: #fff;
}
.nav-menu {
    display: flex;
    justify-content: center;
}
.nav-menu li {
    border-right: dashed 1px #000;
}
.nav-menu li a {
    padding: 4px 3px 2px 30px;
    margin: 0 30px;
    color: #000;
    text-decoration: none;
    font-weight: bold;
    display: flex;
    align-items: center;
    position: relative;
    font-size: 0.9rem;
    line-height: 1.3;
    min-height: 30px;
    height: 100%;
}
.nav-menu li:last-child {
    border-right: none;
}
.nav-menu-icon-about, .nav-menu-icon-activity, .nav-menu-icon-student, .nav-menu-icon-support, .nav-menu-icon-data {
    background-size: 25px;
    background-position: center left 30px;
    background-repeat: no-repeat;
}
     .nav-menu-icon-about {
 background-image: url("https://equal.tut.ac.jp/mt_imgs/menu_icon01.png");
}
     .nav-menu-icon-activity {
 background-image: url("https://equal.tut.ac.jp/mt_imgs/menu_icon02.png");
}
     .nav-menu-icon-student {
 background-image: url("https://equal.tut.ac.jp/mt_imgs/menu_icon03.png");
}
     .nav-menu-icon-support {
 background-image: url("https://equal.tut.ac.jp/mt_imgs/menu_icon04.png");
}
     .nav-menu-icon-data {
 background-image: url("https://equal.tut.ac.jp/mt_imgs/menu_icon05.png");
}
  .nav-menu-icon-about a::before, .nav-menu-icon-activity a::before, .nav-menu-icon-student a::before, .nav-menu-icon-support a::before, .nav-menu-icon-data a::before {
 content: '';
 display: block;
 width: 100%;
 height: 5px;
 position: absolute;
 left: 0;
 bottom: -9px;
 transition: all .5s ease;
 transform: scale(0, 1);
 transform-origin: top;
}
.nav-menu-icon-about a.menu-on::before, .nav-menu-icon-activity a.menu-on::before, .nav-menu-icon-student a.menu-on::before, .nav-menu-icon-support a.menu-on::before, .nav-menu-icon-data a.menu-on::before {
    transform: none;
}
.nav-menu-icon-about a::before, .nav-menu-icon-about a.menu-on::before {
    background: var(--red);
}
.nav-menu-icon-activity a::before, .nav-menu-icon-activity a.menu-on::before {
    background: var(--green);
}
.nav-menu-icon-student a::before, .nav-menu-icon-studenta.menu-on::before {
    background: var(--blue);
}
.nav-menu-icon-support a::before, .nav-menu-icon-support a.menu-on::before {
    background: var(--yellow);
}
.nav-menu-icon-data a::before, .nav-menu-icon-data a.menu-on::before {
    background: var(--orange);
}
.nav-menu-icon-about a:hover::before, .nav-menu-icon-activity a:hover::before, .nav-menu-icon-student a:hover::before, .nav-menu-icon-support a:hover::before, .nav-menu-icon-data a:hover::before {
    transform: scale(1, 1);
}
.header-container-sp {
    display: none;
}

@media (max-width: 1199px) {
.nav-menu-icon-about, .nav-menu-icon-activity, .nav-menu-icon-student, .nav-menu-icon-support, .nav-menu-icon-data {
    background-size: 20px;
    background-position: center left 12px;
}
.nav-menu li a {
    margin: 0 12px;
    padding: 4px 2px 2px 25px;
}
}

@media (max-width: 991px) {
.header-container-pc {
    display: none;
}
.header-container-sp {
    display: block;
    width: 100%;
    position: fixed;
    top: 0;
    background: rgba(255,255,255,0.85);
    z-index: 50;
    box-shadow: 5px 5px 10px rgba(0,0,0,.3);
}
.header-up {
    margin: 10px 10px 5px;
}
.tut-logo {
    width: 115px;
}
.center-title a {
    font-size: 1.0625rem;
    display: block;
    position: relative;
}
.en .center-title a {
    font-size: 0.85rem;
}
.center-title a div {
    margin: 5px 0 0;
}
.en .center-title a div {
    margin: 10px 0 0;
}
.center-logo {
    position: absolute;
    top: -21px;
    left: 230px;
}
.en .center-logo {
    top: -32px;
    left: 248px;
}
/*　ハンバーガーメニュー　クローズ　*/
	
.hamburger {
    background: transparent;
    border: 1px solid #000;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    padding: 12px 0;
    transition: all .3s ease;
    margin-top: 3px;
    color: #000;
}
.hamburger span {
    width: 28px;
    height: 1px;
    background-color: #000;
    position: relative;
    transition: ease .4s; /*ハンバーガーメニュークリック時の三本線の動きを遅延*/
    display: block;
    margin: 0 auto;
}
.hamburger span:nth-child(1) {
    top: 0;
}
.hamburger span:nth-child(2) {
    margin: 4px auto;
}
.hamburger span:nth-child(3) {
    top: 0;
}
.hamburger:hover {
    background: #fff;
}
.hamburger::after {
    content: 'Menu';
    font-size: 0.625rem;
    position: relative;
}
/*　ハンバーガーメニュー　オープン　*/
.hamburger.open span:nth-child(1) {
    transform: rotate(20deg);
    top: 5px;
}
.hamburger.open span:nth-child(2) {
    opacity: 0;
}
.hamburger.open span:nth-child(3) {
    transform: rotate(-20deg);
    top: -5px;
}
.hamburger.open::after {
    content: 'Close';
    font-size: 0.625rem;
}
/*　スマホ版メニュー　*/
.nav-sp {
    opacity: 0;
    background: #fff;
    padding: 20px 10px 40px;
    position: absolute;
    width: 100%;
    right: -100%;
    transition: all .6s ease;
    box-shadow: 5px 5px 10px rgba(0,0,0,.3);
}
.nav-sp.open {
    opacity: 1;
    right: 0;
}
.nav-menu {
    display: block;
    margin-bottom: 20px;
}
.nav-menu li {
    border-right: none;
    border-bottom: 1px dashed #000;
}
.nav-menu li a {
    margin: 0;
    padding: 23px 10px 17px 45px;
}
.nav-menu-icon-about,  .nav-menu-icon-activity,  .nav-menu-icon-student,  .nav-menu-icon-support,  .nav-menu-icon-data {
    background-size: 35px;
    background-position: center left;
}
.nav-menu-icon-about a::before,  .nav-menu-icon-activity a::before,  .nav-menu-icon-student a::before,  .nav-menu-icon-support a::before,  .nav-menu-icon-data a::before {
    display: none;
}
.btn-lang a {
    margin: 20px 0px;
}
}
/*------------------------------------------------------------
ページトップ
------------------------------------------------------------*/

#pagetop {
    position: fixed;
    bottom: 40px;
    right: 30px;
    z-index: 99999;
}
#pagetop a {
    display: block;
    background: #fff;
    border: 1px solid #000;
    border-radius: 50%;
    width: 38px;
    height: 38px;
    overflow: hidden;
    text-indent: -9999px;
    position: relative;
    box-shadow: 1px 1px 10px rgba(0,0,0,.3);
}
#pagetop a::before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    transform: rotate(-46deg);
    position: absolute;
    top: 14px;
    left: 13px;
}
#pagetop a:hover {
    opacity: 0.8;
}
/*------------------------------------------------------------
フッター
------------------------------------------------------------*/

footer {
    margin-top: 100px;
}
.footer-menu {
    display: flex;
    justify-content: center;
    background: #333;
}
.footer-menu li a {
    display: block;
    padding: 10px 15px 10px 20px;
    margin-left: 20px;
    color: #fff;
    text-decoration: none;
    position: relative;
}
.footer-menu li:first-child {
    margin-left: 0;
}
.footer-menu li a::before {
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: rotate(45deg);
    position: absolute;
    top: 19px;
    left: 0;
    transition: all .3s ease;
}
.footer-menu li a:hover::before {
    left: 5px;
}
.copy {
    font-size: 0.8rem;
    text-align: center;
    background: #000;
    color: #fff;
    padding: 10px;
}

@media (max-width: 991px) {
.footer-menu {
    flex-wrap: wrap;
    padding: 15px 15px;
    white-space: nowrap;
}
.footer-menu li {
    width: 50%;
}
.footer-menu li a {
    padding: 0 15px 0 20px;
    margin-left: 0;
}
.footer-menu li a::before {
    top: 11px;
}
}

@media (max-width: 767px) {
.footer-menu-wrap {
    text-align: center;
    background: #333;
}
.footer-menu {
    display: inline-block;
    text-align: left;
}
.footer-menu li {
    width: 100%;
}
}
/*テーブル設定
--------------------------------------------------*/
.table-scroll {
    overflow: auto;
}
table {
    margin-top: 10px;
}
table {
    border-bottom: solid 1px #000;
    border-left: solid 1px #000;
    border-right: none;
    border-top: none;
}
table caption {
    color: #333;
    font-weight: bold;
    text-align: left;
    padding: 0;
    margin-top: 10px;
}
table thead th {
    background-color: #333333;
    color: #FFF;
    font-weight: bold;
}
table tfoot th {
    background-color: #f2f2f2;
    color: #333;
    font-weight: bold;
}
table tfoot td {
    background-color: #fff;
    color: #000;
}
table th {
    padding: 3px 3px;
    border-bottom: none;
    border-left: none;
    border-right: solid 1px #000;
    border-top: solid 1px #000;
    background-color: #f2f2f2;
    color: #000;
    font-weight: bold;
}
table td {
    background-color: #FFF;
    padding: 3px 3px;
    border-bottom: none;
    border-left: none;
    border-right: solid 1px #000;
    border-top: solid 1px #000;
    color: #000;
}
.bg-yellow th, .bg-yellow td, .bg-yellow {
    background-color: #333;
    color: #fff;
    font-weight: normal;
}
th.bg-li-yellow {
    background-color: #A8A8A8;
    color: #000000;
}
td.bg-li-yellow {
    background-color: #DDDDDD;
    color: #000;
}
.table-contact-title {
    padding: 15px 40px 0 30px;
    font-size: 1.25rem;
    font-weight: bold;
    position: relative;
    white-space: nowrap;
}
.table-contact-title::before {
    content: '';
    display: block;
    background: #ccc;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    position: absolute;
    top: 21px;
    left: 0;
}
.table-contact-title::after {
    content: '';
    display: block;
    background: #000;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    position: absolute;
    top: 27px;
    left: 6px;
}
table.table-contact {
    width: 100%;
    border: none;
}
table.table-contact td {
    border: none;
    border-top: 1px dashed #000;
    padding: 15px 0;
}
table.table-contact tr:last-child td {
    border-bottom: 1px dashed #000;
}

@media (max-width: 767px) {
table.table-contact th {
    display: block;
}
}
/*テキスト位置設定
--------------------------------------------------*/
.text-center {
    text-align: center;
}
.text-right {
    text-align: right;
}
.text-left {
    text-align: left;
}
.text-middle {
    vertical-align: middle;
}
.text-top {
    vertical-align: top;
}
.text-bottom {
    vertical-align: bottom;
}
/*テキスト位置設定
--------------------------------------------------*/
.text-center {
    text-align: center;
}
.text-right {
    text-align: right;
}
.text-left {
    text-align: left;
}
.text-middle {
    vertical-align: middle;
}
.text-top {
    vertical-align: top;
}
.text-bottom {
    vertical-align: bottom;
}
/*リスト設定
--------------------------------------------------*/
.list-f:after, .list-two:after, .list-three:after, .list-four:after, .list-fs:after, .linklist-f:after, .linklist-two:after, .linklist-three:after, .linklist-four:after, .linklist-fs:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.list-f, .list-two, .list-three, .list-four, .list-fs, .linklist-f, .linklist-two, .linklist-three, .linklist-four, .linklist-fs {
    display: inline-table;
    min-height: 1%;
}
/* Hides from IE-mac \*/
* html .list-f, * html .list-two, * html .list-three, * html .list-four, * html .list-fs, * html .linklist-f, * html .linklist-two, * html .linklist-three, * html .linklist-four, * html .linklist-fs {
    height: 1%;
}
.list-f, .list-two, .list-three, .list-four, .list-fs, .linklist-f, .linklist-two, .linklist-three, .linklist-four, .linklist-fs {
    display: block;
}
/*---- リストアイコン基本設定 ----*/
.list, .list-f, .list-two, .list-three, .list-four, .list-s, .list-fs {
    margin: 10px 0 0 10px;
}
/*リスト大*/
.list li, .list-f li, .list-two li, .list-three li, .list-four li {
    padding: 1px 0 1px 21px;
    position: relative;
}
.list li::before, .list-f li::before, .list-two li::before, .list-three li::before, .list-four li::before {
    content: '';
    display: block;
    background: #999;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    position: absolute;
    top: 9px;
    left: 0;
}
/*リスト小*/
.list-s li, .list-fs li {
    padding: 1px 0 1px 21px;
    position: relative;
}
.list-s li::before, .list-fs li::before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    border: 2px solid #999;
    border-radius: 50%;
    position: absolute;
    top: 9px;
    left: 0;
}
/*---通常リスト---*/
.list li {
}
/*通常リスト:横並び*/
.list-f li {
    white-space: nowrap;
    float: left;
    padding-right: 20px;
}
/*通常リスト:2カラム*/
.list-two li {
    float: left;
    width: 45%;
    margin-right: 1%;
}
/*通常リスト:3カラム*/
.list-three li {
    float: left;
    width: 27%;
    margin-right: 1%;
}
/*通常リスト:4カラム*/
.list-four li {
    float: left;
    width: 21%;
    margin-right: 1%;
}
/*通常リスト:小さめ*/
.list-s li {
}
/*通常リスト:横並び(小さめ)*/
.list-fs li {
    white-space: nowrap;
    float: left;
    padding-right: 20px;
}
/*入れ子にしたとき、画像が出てしまうのを防ぐ*/
.none li {
    background: none;
    padding-left: 0px;
}
/*---- リンクリストアイコン基本設定 ----*/
/* リスト大 */
.linklist, .linklist-f, .linklist-two, .linklist-three, .linklist-four {
    margin: 10px 0 0 10px;
}
.linklist li, .linklist-f li, .linklist-two li, .linklist-three li, .linklist-four li, p.link {
    padding: 1px 0 1px 21px;
}
.linklist li a, .linklist-f li a, .linklist-two li a, .linklist-three li a, .linklist-four li a, p.link a {
    position: relative;
}
.linklist li a::before, .linklist-f li a::before, .linklist-two li a::before, .linklist-three li a::before, .linklist-four li a::before, p.link a::before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 9px;
    border-color: transparent transparent transparent #000;
    position: absolute;
    top: 7px;
    left: -20px;
    transition: all .3s ease;
}
.linklist li a:hover::before, .linklist-f li a:hover::before, .linklist-two li a:hover::before, .linklist-three li a:hover::before, .linklist-four li a:hover::before, p.link a:hover::before {
    left: -15px;
}
/* リスト小 */
.linklist-s, .linklist-fs {
    margin: 10px 0 0 10px;
}
.linklist-s li, .linklist-fs li {
    padding: 1px 0 1px 21px;
}
.linklist-s li a, .linklist-fs li a {
    position: relative;
}
.linklist-s li a::before, .linklist-fs li a::before {
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    border-top: 2px solid #999;
    border-right: 2px solid #999;
    transform: rotate(45deg);
    position: absolute;
    top: 8px;
    left: -20;
    transition: all .3s ease;
}
.linklist-s li a:hover::before, .linklist-fs li a:hover::before {
    left: -15px;
}
/*---- リンクリスト ----*/
.linklist li {
}
/*リンクリスト：横並び*/
.linklist-f li {
    white-space: nowrap;
    float: left;
    padding-right: 20px;
}
/*リンクリスト：2カラム*/
.linklist-two li {
    float: left;
    width: 45%;
    margin-right: 1%;
}
/*リンクリスト：3カラム*/
.linklist-three li {
    float: left;
    width: 27%;
    margin-right: 1%;
}
/*リンクリスト：4カラム*/
.linklist-four li {
    float: left;
    width: 19%;
    margin-right: 1%;
}
/*リンクリスト:小さめ*/
.linklist-s li {
}
/*リンクリスト：横並び(小さめ)*/
.linklist-fs li {
    white-space: nowrap;
    float: left;
    padding-right: 20px;
}
/*---- 単体リンク ----*/
p.link {
}
/*---- 数字リスト ----*/
.ollist-lr {
    list-style-type: lower-roman;
}
.ollist-ur {
    list-style-type: upper-roman;
}
.ollist-la {
    list-style-type: lower-latin;
}
.ollist-ua {
    list-style-type: upper-latin;
}
/*----- 位置設定 -----*/
/*1/2サイズ*/
.harf-l {
    float: left;
    width: 49%;
}
.harf-r {
    float: right;
    width: 49%;
}
/*1/3サイズ*/
.three-l {
    width: 32%;
    float: left;
}
.three-c {
    width: 32%;
    float: left;
    padding-left: 10px;
}
.three-r {
    width: 32%;
    float: right;
}
/*フロート左*/
.float-l {
    float: left;
    width: auto;
    margin-right: 5px;
}
/*フロート右*/
.float-r {
    float: right;
    width: auto;
    margin-left: 5px;
}
/*----- カラーボックス -----*/

/*オレンジ　→　グレイ*/
.box01 {
    padding: 15px;
    margin: 20px 0;
    background-color: #f2f2f2;
    border-radius: 10px;
}
/*グレイ　→　ボーダー付きグレイ*/
.box02 {
    padding: 15px;
    margin: 20px 0;
    background-color: #f2f2f2;
    border: 1px solid #000;
    border-radius: 10px;
}
/*レッド*/
.box03 {
    padding: 15px;
    margin: 20px 0;
    background-color: #FFDCCE;
    border-radius: 10px;
}
/*オレンジライン*/
.box04 {
    padding: 15px;
    margin: 20px 0;
    border: 3px double #FEE89C;
    border-radius: 10px;
}
/*グレイライン*/
.box05 {
    padding: 15px;
    margin: 20px 0;
    border: 3px double #E3E3E3;
    border-radius: 10px;
}
/*レッドライン*/
.box06 {
    padding: 15px;
    margin: 20px 0;
    border: 3px double #FFDCCE;
    border-radius: 10px;
}
/*レッドライン*/
.box07 {
    padding: 10px;
    margin: 10px 0;
    border: double 3px #B72000;
}
/*マージン
---------------------------------------*/
/*マージン設定*/
/*マージン全方向0*/
.margin-0 {
    margin: 0 !important;
}
/*マージン全方向10*/
.margin-10 {
    margin: 10px !important;
}
/*マージン全方向20*/
.margin-20 {
    margin: 20px !important;
}
/*マージン全方向30*/
.margin-30 {
    margin: 30px !important;
}
/*マージン左右0*/
.margin-rl0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
}
/*マージン左右10*/
.margin-rl10 {
    margin-right: 10px !important;
    margin-left: 10px !important;
}
/*マージン左右20*/
.margin-rl20 {
    margin-right: 20px !important;
    margin-left: 20px !important;
}
/*マージン左右30*/
.margin-rl30 {
    margin-right: 30px !important;
    margin-left: 30px !important;
}
/*マージン左右 中央*/
.margin-rlauto {
    margin-right: auto !important;
    margin-left: auto !important;
}
/*マージン上下0*/
.margin-tb0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
/*マージン上下10*/
.margin-tb10 {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}
/*マージン上下20*/
.margin-tb20 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}
/*マージン上下30*/
.margin-tb30 {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}
/*マージン上0*/
.margin-top0 {
    margin-top: 0 !important;
}
/*マージン上5*/
.margin-top5 {
    margin-top: 5px !important;
}
/*マージン上10*/
.margin-top10 {
    margin-top: 10px !important;
}
/*マージン上15*/
.margin-top15 {
    margin-top: 15px !important;
}
/*マージン上20*/
.margin-top20 {
    margin-top: 20px !important;
}
/*マージン上30*/
.margin-top30 {
    margin-top: 30px !important;
}
/*マージン上40*/
.margin-top40 {
    margin-top: 40px !important;
}
/*マージン下0*/
.margin-bottom0 {
    margin-bottom: 0 !important;
}
/*マージン下5*/
.margin-bottom5 {
    margin-bottom: 5px !important;
}
/*マージン下10*/
.margin-bottom10 {
    margin-bottom: 10px !important;
}
/*マージン下20*/
.margin-bottom20 {
    margin-bottom: 20px !important;
}
/*マージン下30*/
.margin-bottom30 {
    margin-bottom: 30px !important;
}
/*マージン左0*/
.margin-l0 {
    margin-left: 0 !important;
}
/*マージン左10*/
.margin-l10 {
    margin-left: 10px !important;
}
/*マージン左20*/
.margin-l20 {
    margin-left: 20px !important;
}
/*マージン左30*/
.margin-l30 {
    margin-left: 30px !important;
}
/*マージン右0*/
.margin-r0 {
    margin-right: 0 !important;
}
/*マージン右10*/
.margin-r10 {
    margin-right: 10px !important;
}
/*マージン右20*/
.margin-r20 {
    margin-right: 20px !important;
}
/*マージン右30*/
.margin-r30 {
    margin-right: 30px !important;
}
/*リスト用インデント幅*/
/*1em*/
.ulindent-1 li {
    text-indent: -1em;
    margin-left: 1em;
}
/*1.1em*/
.ulindent-1-1 li {
    text-indent: -1.1em;
    margin-left: 1.1em;
}
/*1.2em*/
.ulindent-1-2 li {
    text-indent: -1.2em;
    margin-left: 1.2em;
}
/*1.3em*/
.ulindent-1-3 li {
    text-indent: -1.3em;
    margin-left: 1.3em;
}
/*1.4em*/
.ulindent-1-4 li {
    text-indent: -1.4em;
    margin-left: 1.4em;
}
/*1.5em*/
.ulindent-1-5 li {
    text-indent: -1.5em;
    margin-left: 1.5em;
}
/*1.6em*/
.ulindent-1-6 li {
    text-indent: -1.6em;
    margin-left: 1.6em;
}
/*1.7em*/
.ulindent-1-7 li {
    text-indent: -1.7em;
    margin-left: 1.7em;
}
/*1.8em*/
.ulindent-1-8 li {
    text-indent: -1.8em;
    margin-left: 1.8em;
}
/*1.9em*/
.ulindent-1-9 li {
    text-indent: -1.9em;
    margin-left: 1.9em;
}
/*2em*/
.ulindent-2 li {
    text-indent: -2em;
    margin-left: 2em;
}
/*リスト以外インデント*/
/*1em*/
.indent-1 {
    text-indent: -1em;
    margin-left: 1em;
}
/*1.1em*/
.indent-1-1 {
    text-indent: -1.1em;
    margin-left: 1.1em;
}
/*1.2em*/
.indent-1-2 {
    text-indent: -1.2em;
    margin-left: 1.2em;
}
/*1.3em*/
.indent-1-3 {
    text-indent: -1.3em;
    margin-left: 1.3em;
}
/*1.4em*/
.indent-1-4 {
    text-indent: -1.4em;
    margin-left: 1.4em;
}
/*1.5em*/
.indent-1-5 {
    text-indent: -1.5em;
    margin-left: 1.5em;
}
/*1.6em*/
.indent-1-6 {
    text-indent: -1.6em;
    margin-left: 1.6em;
}
/*1.7em*/
.indent-1-7 {
    text-indent: -1.7em;
    margin-left: 1.7em;
}
/*1.8em*/
.indent-1-8 {
    text-indent: -1.8em;
    margin-left: 1.8em;
}
/*1.9em*/
.indent-1-9 {
    text-indent: -1.9em;
    margin-left: 1.9em;
}
/*2em*/
.indent-2 {
    text-indent: -2em;
    margin-left: 2em;
}
/*ライン*/
/*ブロック要素の下にラインがつく*/
.line1 {
    border-bottom: solid 1px #AAAAAA;
    padding-bottom: 10px;
    margin-bottom: 10px;
}
.line2 {
    background-image: url(../imgs/common/li_01.gif);
    background-position: bottom;
    background-repeat: repeat-x;
    padding-bottom: 10px;
    margin-bottom: 10px;
}
/*テキスト設定
--------------------------------------------------*/
/*---- フォントサイズ ----*/
.font-s {
    font-size: 85%;
    line-height: 1.2em;
}
.font-l {
    font-size: 115%;
}
/*---- フォントカラー ----*/
.font-red {
    color: var(--red);
}
.font-orange {
    color: var(--orange);
}
.font-yellow {
    color: var(--yellow);
}
.font-green {
    color: var(--green);
}
.font-blue {
    color: var(--blue);
}
.font-darkblue {
    color: #001E6A;
}
.font-white {
    color: #FFFFFF;
}
.font-gray {
    color: #333333;
}
/*---- ボールド ----*/
.font-bold {
    font-weight: bold;
}
/*---- 太字フォントをノーマルにする ----*/
.font-normal {
    font-weight: normal;
}
/*---- イタリック ----*/
.font-italic {
    font-style: italic;
}
/*---- 強調見出し ----*/
p.midashi {
    font-size: 115%;
}
p.midashi strong {
    color: #1D8EA3;
}
/*---- 画像用キャプション ----*/
.img-caption {
    font-size: 80%;
    color: #003366;
}
/*---- Youtube ----*/

.youtube-wrap {
    max-width: 560px;
}
.youtube {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
}
.youtube iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}
/************************************************************/
/**ページネーション */
.pager .pagination {
    text-align: center;
}
.pager {
    margin: 0 auto;
}
.pager .pagination li {
    margin: 0 2px;
    padding: 0;
    display: inline-block;
    width: 38px;
    height: 38px;
    text-align: center;
    position: relative;
    border-radius: 50px;
    z-index: 1;
}
.pager .pagination li.pre a, .pager .pagination li.next a, .pager .pagination li.first a, .pager .pagination li.last a {
    background: #333;
    color: #fff;
    border-radius: 50%;
}
.pager .pagination li a {
    vertical-align: middle;
    border: 1px solid #000;
    border-radius: 50%;
    font-size: 0.8rem;
    color: #000;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    display: table;
    text-decoration: none;
    transition: all 0.3s;
    z-index: 10;
}
.pager .pagination li a::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #f2f2f2;
    opacity: 0;
    transition: all 0.3s;
    z-index: -1;
}
.pager .pagination li a span {
    display: table-cell;
    vertical-align: middle;
}
.pager .pagination li a.active {
    background: #c7000a;
    color: #fff;
    border: none;
    text-decoration: underline;
}
.pager .pagination li.pre a, .pager .pagination li.next a, .pager .pagination li.first a, .pager .pagination li.last a {
    border: none;
    position: relative;
}
.pager .pagination li.pre a::before, .pager .pagination li.next a::before, .pager .pagination li.first a::before, .pager .pagination li.last a::before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5.5px 0 5.5px 9px;
    border-color: transparent transparent transparent #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-5px, -5px);
}
.pager .pagination li.pre a::after, .pager .pagination li.next a::after {
    display: none;
}
.pager .pagination li.first a::after, .pager .pagination li.last a::after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5.5px 0 5.5px 9px;
    border-color: transparent transparent transparent #fff;
    position: absolute;
    top: 50%;
    left: 60%;
    opacity: 1;
    background: transparent;
    border-radius: 0;
}
.pager .pagination li.pre a::before {
    transform: translate(-5px, -5px) rotate(180deg);
}
.pager .pagination li.first a::before {
    transform: translate(-9px, -5px) rotate(180deg);
}
.pager .pagination li.first a::after {
    transform: translate(-3px, -5px) rotate(180deg);
}
.pager .pagination li.next a::before {
    transform: translate(-4px, -5px);
}
.pager .pagination li.last a::before {
    transform: translate(-9px, -5px);
}
.pager .pagination li.last a::after {
    transform: translate(-3px, -5px);
}
.pager .pagination li.pre a:hover, .pager .pagination li.next a:hover, .pager .pagination li.first a:hover, .pager .pagination li.last a:hover {
    background: #333;
    opacity: .7;
}
.text_area a.view-all {
    position: relative;
    padding: 0;
    display: inline-block;
    text-decoration: underline;
}
.view-all:before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 9px;
    border-color: transparent transparent transparent #000;
    position: absolute;
    top: 7px;
    left: -20px;
    transition: all .3s ease;
}
.text_area a.view-all:hover {
    text-decoration: none;
}
.text_area a.view-all:hover::before {
    left: -15px;
}
@media only screen and (max-width: 767px) {
.pager .pagination li {
    margin: 0 2px;
    padding: 0;
    display: inline-block;
    width: 30px;
    height: 30px;
    text-align: center;
    position: relative;
    border-radius: 50px;
    z-index: 1;
}
 @media screen and (max-width: 767px) {
.list-f li, .list-two li, .list-three li, .list-four li, .list-fs li, .linklist-f li, .linklist-two li, .linklist-three li, .linklist-four li, .linklist-fs li {
 float: none;
 width: auto;
}
.harf-l, .harf-r, .three-l, .three-c, .three-r, .float-l, .float-r, .img-l, .img-r, .one-third, .two-third {
 float: none;
 width: auto;
 margin: 0;
 padding: 0;
}
.img-l, .img-r {
 text-align: center;
 margin: 10px 0;
}
.img-l img, .img-r img {
 margin:10px 0 5px;
}
.harf-l img, .harf-r img {
 margin: 10px 0 5px;
}
}