@charset "UTF-8";
/* ######################################################################################

　display　表示・非表示

###################################################################################### */
@media print, screen and (min-width: 768px) {
    div.pc, ul.pc, ol.pc, li.pc, dl.pc, dt.pc, dd.pc {
        display: block;
    }
    div.sp, ul.sp, ol.sp, li.sp, dl.sp, dt.sp, dd.sp {
        display: none;
    }

    span.pc, img.pc, em.pc, br.pc {
        display: inline;
    }
    span.sp, img.sp, em.sp, br.sp {
        display: none;
    }
    }
    @media screen and (max-width: 767px) {
    div.sp, ul.sp, ol.sp, li.sp, dl.sp, dt.sp, dd.sp {
        display: block;
    }
    div.pc, ul.pc, ol.pc, li.pc, dl.pc, dt.pc, dd.pc {
        display: none;
    }

    span.sp, img.sp, em.sp, br.sp {
        display: inline;
    }
    span.pc, img.pc, em.pc, br.pc {
        display: none;
    }
}
/* ######################################################################################

　アクセシビリティ対応　sr-only

###################################################################################### */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
/* ====================================================
    ボタンボックス
==================================================== */
.buttonBox {
text-align: center;
}
.buttonBox p {
text-align: center;
}

.buttonBox.center .row {
display: inline-block;
width: 103%;
max-width: 768px;
}
.buttonBox.center.single .row {
max-width: 384px;
}

@media print, screen and (min-width: 768px) {
.button {
        padding: 1.7em 1em;
        font-size: 1.4rem;
    }
.buttonBox li .button {
	border-radius: 6px;
	display: block;
	padding: 1.7em 1em;
    font-size: 1.5rem;
	min-width: 280px;
	}
 }
@media print, screen and (max-width: 767px) {
.buttonBox li .button {
	border-radius: 6px;
	display: block;
	padding: 1.5em 1em;
    font-size: 1.5rem;
	}
.buttonBox > .row > .col-xs-12 {
    margin-top: 0.25em;
    margin-bottom: 0.25em;
}

}

/* ====================================================
    外部リンク
==================================================== */
.externalLink:after {
    content: "";
    position: relative;
    top: -1px;
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-left: 10px;
    background-image: url(../img/icon_externalLink.svg);
}

/* ====================================================
    PDF
==================================================== */
.button.pdf.file {
    padding: 1px 6px 11px 8px;
    background: #fff;
    border: 2px solid #CC0000;
    border-radius: 2px;
    color: #CC0000;
    font-size: 1.1rem;
    font-weight: bold;
}
.button.pdf.file:after {
    content: "";
    position: relative;
    top: 6px;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-left: 5px;
    background-image: url(../img/contents/icon_pdf.svg);
}
@media print, screen and (min-width: 768px) {
    .button.pdf.file:hover {opacity: 0.6;}
}

/* ######################################################################################

　ハンバーガーメニュー：meanMenu

###################################################################################### */
/* ====================================================
　3＠デフォルト　※基本的には変更しない
==================================================== */
/* ＋－のはみ出し防止 */
.meanMenuAcc ul li,
.mean-container .mean-nav ul li {
    position: relative;
    z-index: 10;
}

.meanMenuAcc ul li a.meanAcc-expand,
.mean-container .mean-nav ul li button.mean-expand {
    background: none !important;
    border: none !important;
}

.mean-container .mean-bar {
    padding: 0;
    min-height: 0;
}

.header {
    width: 100%;
    position: relative;
}

.mean-container .mean-bar {
    height: 0;
}

.meanMenuAcc ul li a,
.mean-container .mean-nav ul li a {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

/* 重なり順 DF
-------------------------------------*/
.header {
    z-index: 9999;
}

.mean-bar {
    z-index: 10000;
}

/* ×スタイル DF
-------------------------------------*/
.mean-container button.meanmenu-reveal.meanclose span:nth-of-type(1) {
    transform: rotate(45deg);
}

.mean-container button.meanmenu-reveal.meanclose span:nth-of-type(2) {
    opacity: 0;
}

.mean-container button.meanmenu-reveal.meanclose span:nth-of-type(3) {
    transform: rotate(-45deg);
}

/* ＋・－　スタイル DF
-------------------------------------*/
.meanMenuAcc ul li a.meanAcc-expand,
.mean-container .mean-nav ul li button.mean-expand {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px !important;
}

.meanMenuAcc ul li a.meanAcc-expand:before,
.meanMenuAcc ul li a.meanAcc-expand:after,
.mean-container .mean-nav ul li button.mean-expand:before,
.mean-container .mean-nav ul li button.mean-expand:after {
    content: "";
    display: block;
    position: absolute;
}

.meanMenuAcc ul li a.meanAcc-expand:after,
.mean-container .mean-nav ul li button.mean-expand:after {
    transform: rotate(90deg);
}

.meanMenuAcc ul li a.meanAcc-expand.meanAcc-clicked:after,
.mean-container .mean-nav ul li button.mean-expand.mean-clicked:after {
    display: none;
}

/* スクロール対応 DF
-------------------------------------*/
.meanmenu-reveal.meanclose + .mean-nav {
    box-sizing: border-box;
    transition: height ease 0.3s;
    max-height: calc(100vh - 64px);
    /* 100% からヘッダの高さを引く*/
    overflow-y: scroll;
}

/* mmOpen時にbodyのスクロールを止める DF
-------------------------------------*/
/*
    html.mmOpen,
    html.mmOpen body {overflow: auto; height: 100%;}
    html.mmOpen body {overflow: hidden;}
*/

/* meanMenuAcc DF
-------------------------------------*/
.meanMenuAcc ul li a {
    display: block;
    border-top: 1px solid #383838;
    text-decoration: none;
    text-transform: uppercase;
}

.meanMenuAcc ul {
    position: relative;
    z-index: 10;
}

.meanMenuAcc ul li {
    position: relative;
    float: left;
    width: 100%;
}

.meanMenuAcc ul li a.meanAcc-expand {
    position: absolute;
    z-index: 2;
    right: 0;
    top: 0;
    margin-top: 1px;
    text-align: center;
}

/* #####################  ここから　meanMenu　個別設定  ##################### */
/* =========================================================
  PC対応  ※PCで使用する場合は削除
          ※[meanScreenWidth] に大きめの値を設定
========================================================= */
@media print, screen and (min-width: 768px) {
    .meanMenu {
        display: none !important;
    }
}
@media screen and (max-width: 767px) {
    /* =========================================================
    　ヘッダ固定  ※固定にしない場合は削除
    ========================================================= */
    header,
    .mean-container .mean-bar {
        position: fixed !important;
    }

    /* =========================================================
    　ヘッダ高さ  ※[meanNavPush]にも設定
    ========================================================= */
    .header .contents {
        height: 65px;
    }

    .mean-container .mean-nav {
        margin-top: 65px;
    }
    .mean-container .mean-nav ul li a:hover {
        background: #f1f2f6;
    }

    /* ====================================================
    　ヘッダスタイル
    ==================================================== */
    .header .contents {
        background: #fff;
        box-shadow: none;
    }
}

/* ====================================================
　≡ボタン
==================================================== */
.mean-container button.meanmenu-reveal {
    width: 65px;
    height: 65px;
    padding: 0;
    background: #0058C7;
    border: none;
}

.mean-nav ul li li > a:not(fitst-of-child) {
    opacity: 1 !important;
}

/* ====================================================
　≡スタイル
==================================================== */
.mean-container button.meanmenu-reveal span {
    position: relative;
    top: 4px;
    /* ≡の位置調整 */
    width: 20px;
    /* ≡の長さ */
    background: #fff;
    /* ≡の色 */
    height: 2px;
    /* ≡の太さ */
    margin: 6px auto;
    /* ≡の間隔 */
}
.mean-container button.meanmenu-reveal em {
    text-align: center;
    font-size: 1.1rem;
    font-style: normal;
}
.mean-container button.meanmenu-reveal span:nth-of-type(3) {
    margin-bottom: 11px;
}

/* ====================================================
　×スタイル
==================================================== */
.mean-container button.meanmenu-reveal.meanclose span {
    top: 26px;
    /* ×の位置調整 */
    left: 20px;
    /* ×の位置調整 */
    width: 40%;
    /* ×の長さ */
    background: #fff;
    /* ×の色 */
    height: 2px;
    /* ×の太さ */
}
.mean-container button.meanmenu-reveal.meanclose em {
    position: relative;
    top: 1em;
}

/* ====================================================
　メニュースタイル
==================================================== */
.meanMenuAcc,
.mean-container .mean-nav {line-height:1;}

.meanMenuAcc > ul > li > a,
.mean-container .mean-nav > ul > li > a {
    width: 100%;
    background: #f1f2f6;
    border-top-color: #DBE2E6 !important;
    border-bottom:none !important;
    padding: 1.5em 3.5em 1.5em 15px !important;
    color: #233036;
    font-weight:bold;
    font-size:1.5rem;
}
.meanMenuAcc > ul > li > ul > li > a,
.mean-container .mean-nav > ul > li > ul > li > a {
    width: 100%;
    background: #ffffff;
    border-top-color: #DBE2E6 !important;
    border-bottom:none !important;
    padding: 1.5em 3.5em 1.5em 15px !important;
    color: #005BAC;
    font-weight:bold;
    font-size:1.5rem;
}
.meanMenuAcc > ul > li > ul > li > ul > li a,
.mean-container .mean-nav > ul > li > ul > li > ul > li a {
    background: #ffffff;
    border-top-color: #DBE2E6 !important;
    border-bottom:none !important;
    color: #233036;
    font-size:1.3rem;
}
.meanMenuAcc > ul > li > ul > li > ul > li > a,
.mean-container .mean-nav > ul > li > ul > li > ul > li > a {
    padding: 1.2em 3.5em 1.2em calc(15px + 1em) !important;
}
.meanMenuAcc > ul > li > ul > li > ul > li > ul > li > a,
.mean-container .mean-nav > ul > li > ul > li > ul > li > ul > li > a {
    padding: 1.2em 3.5em 1.2em calc(15px + 2em) !important;
}

.meanMenuAcc > ul > li > ul > li > ul > li > ul > li > ul > li > a,
.mean-container .mean-nav > ul > li > ul > li > ul > li > ul > li > ul > li > a {
    padding: 1.2em 3.5em 1.2em calc(15px + 3em) !important;
}
.meanMenuAcc > ul > li > ul > li > ul > li > ul > li > ul > li > ul > li > a,
.mean-container .mean-nav > ul > li > ul > li > ul > li > ul > li > ul > li > ul > li > a {
    padding: 1.2em 3.5em 1.2em calc(15px + 4em) !important;
}


/* 下端の罫線 */
/* ====================================================
　＋・－　スタイル
==================================================== */
.meanMenuAcc ul li button.meanAcc-expand,
.mean-container .mean-nav ul li button.mean-expand {
    width: 4em;
    height: 4em;
    background: none !important;
}
.mean-container .mean-nav ul > li > ul > li > ul > li button.mean-expand {
    width: 4em;
    height: 3em;
}
.mean-container .mean-nav ul li button.mean-expand:before,
.mean-container .mean-nav ul li button.mean-expand:after {
    background: #18639F;/* ＋－の色 */
    width: 1.25em;/* ＋－の間隔 */
    height: 2px; /* ＋－の太さ */
}

.meanMenuAcc ul li button.meanAcc-expand:before,
.mean-container .mean-nav ul li button.mean-expand:before {
    top: 50%;
    left: 50%;
    transform:translate(-50%,-50%);
}
.meanMenuAcc ul li button.meanAcc-expand:after,
.mean-container .mean-nav ul li button.mean-expand:after {
    top:50%;
    left:50%;
    transform: translate(-50%,-50%) rotate(90deg);
}

.overray {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:0;
    background:rgba(0,0,0,0);
    transition:background ease 0.5s;
    z-index:11;
}
.mmOpen .overray,
.overray.active {
    height:100vh;
    background:rgba(0,0,0,0.8);
}



/* ######################################################################################

　パンくずリスト：widget.css_topicPath

###################################################################################### */
.topicPath {
    display: block;
    clear: both;
    width: 100%;
    margin: 0 auto;
    padding-top: 10px;
    padding-bottom: 11px;
    line-height: 1;
    text-align: left;
    background-color: #F5F8FA;
}
.topicPath ol li {
    display: inline;
    line-height: 1.5;
}
.topicPath ol li:not(:first-child):before {
    content: "";
    display: inline-block;
    width: 0.5em;
    height: 0.5em;
    border-right: 2px solid #BABED1;
    border-bottom: 2px solid #BABED1;
    transform: rotate(-45deg);
    margin: 0 1em 0 0.4em;
    vertical-align: middle;
}

.topicPath ol li a,
.topicPath ol li span {
    color: #233036;
    text-decoration: none;
}

.topicPath ol li a:hover { text-decoration: underline; }
.topicPath li:first-child a:before {
    content: "";
    position: relative;
    top: 1px;
    display: inline-block;
    width: 11px;
    height: 12px;
    margin-right: 4px;
    background-image: url(../img/icon_home.svg);
	background-size:contain;
}

@media print, screen and (min-width: 768px) {
    .topicPath li,
    .topicPath a,
    .topicPath span {font-size: 1.2rem;}
}
@media screen and (max-width: 767px) {
    .topicPath li,
    .topicPath a,
    .topicPath span {font-size: 1.1rem;}
}


/* ######################################################################################

　帯背景　wallBelt

###################################################################################### */
.wallBelt {
    overflow: hidden;
}
.wallBelt.yellow{
    background: #FEFDEC;
}
@media print, screen and (min-width: 768px) {
    .wallBelt {
        padding-top: 90px;
        padding-bottom: 90px;
    }
    .wallBelt.narrow {
        padding-top: 22px;
        padding-bottom: 22px;
    }
    .wallBelt.wide {
        padding-top: 120px;
        padding-bottom: 120px;
    }
    .wallBelt.extra {
        padding-top: 120px;
        padding-bottom: 120px;
    }
    .wallBelt.topNarrow {
        padding-top: 22px;
    }
    .wallBelt.topWide {
        padding-top: 90px;
    }
    .wallBelt.topExtra {
        padding-top: 120px;
    }
    .wallBelt.bottomNarrow {
        padding-bottom: 22px;
    }
    .wallBelt.bottomWide {
        padding-bottom: 90px;
    }
    .wallBelt.bottomExtra {
        padding-bottom: 120px;
    }
}
@media screen and (max-width: 767px) {
    .wallBelt {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .wallBelt.narrow {
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .wallBelt.wide {
        padding-top: 45px;
        padding-bottom: 45px;
    }
    .wallBelt.extra {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .wallBelt.topNarrow {
        padding-top: 15px;
    }
    .wallBelt.topWide {
        padding-top: 45px;
    }
    .wallBelt.topExtra {
        padding-top: 60px;
    }
    .wallBelt.bottomNarrow {
        padding-bottom: 15px;
    }
    .wallBelt.bottomWide {
        padding-bottom: 45px;
    }
    .wallBelt.bottomExtra {
        padding-bottom: 60px;
    }
}

.wallBelt.gray {
    background: #F2F6F6;
}
.wallBelt.blue {
    background: #93adfb;
}
.wallBelt.zero {
    padding-top: 0;
    padding-bottom: 0;
}
.wallBelt.topZero {
    padding-top: 0;
}
.wallBelt.bottomZero {
    padding-bottom: 0;
}

/* ######################################################################################

    pageTop：ページトップ

###################################################################################### */
.pageTopFix{
    position: fixed;
    z-index: 8000;
    cursor: pointer;
}

@media print, screen and (min-width: 768px) {
    .pageTopFix{
        bottom: 130px;
        right: 50px;
        width: 92px;
        height: 92px;
        background-image: url(../img/pageTop_pc.svg);
    }
}
@media screen and (max-width: 767px) {
    .pageTopFix{
        bottom: 50px;
        right: 15px;
        width: 70px;
        height: 70px;
        background-image: url(../img/pageTop_sp.svg);
    }
}
@media print{
    .pageTopFix{
        display: none!important;
    }
}

/* ######################################################################################

　タイトル

###################################################################################### */
/* ====================================================
　pageTitle
==================================================== */
.pageTitle {
    background-position: center center;
    background-repeat: no-repeat;
	background-size: cover;
}
.pageTitle .contents{
    position: relative;
}
.pageTitle .title {
    position: absolute;
    background: rgba(0, 88, 199, 0.7);
    color: #fff;
}

@media print, screen and (min-width: 768px) {
    .pageTitle {
        height: 320px;
    }
    .pageTitle .contents{
        max-width: 1014px;
    }
    .pageTitle .title {
        left: 0;
        top: 95px;
        min-width: 430px;
        max-width: 530px;
        padding: 24px 60px 24px 40px;
        font-size: 2.8rem;
        line-height: 1.6429;
    }
}
@media screen and (max-width: 767px) {
    .pageTitle {
        height: 200px;
    }
    .pageTitle .title {
        top: 60px;
        left: 15px;
        max-width: 310px;
        padding: 17px 14px 16px 14px;
        font-size: 1.8rem;
        line-height: 1.8889;
    }
}

/* ====================================================
　borderBottomTitle
==================================================== */
* + .borderBottomTitle {margin-top:2.5em;}
.borderBottomTitle {
    position: relative;
    border-bottom: 1px solid #E6EDF1;
    font-weight: bold;
}
.borderBottomTitle:before {
    content: "";
    display: block;
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 50px;
    height: 3px;
    background: #0058C7;
}
@media print, screen and (min-width: 768px) {
    .borderBottomTitle {
        margin-bottom: 1.25em;
        padding-bottom: 1em;
        font-size: 2.8rem;
    }
    .borderBottomTitle.large {
        font-size: 3rem;
    }
}
@media screen and (max-width: 767px) {
    .borderBottomTitle {
        margin-bottom: 0.7273em;
        padding-bottom: 0.7727em;
        font-size: 2.2rem;
        line-height: 1.6364;
    }
}

/* =======================================================
bgBorderTitle
========================================================== */
.bgBorderTitle {
    margin-bottom: 1em;
    padding: 0.8125em 1em;
    background: #F5F8FA;
    border-bottom: 1px solid #0058C7;
    font-size: 1.6rem;
    font-weight: bold;
    line-height: 1.5;
}
/* =======================================================
　titleUnderLeftLine
========================================================== */
.circleTitle {
    position: relative;
    font-weight: bold;
}
.circleTitle:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 13px;
    height: 13px;
    border: 3px solid #0058C7;
    border-radius: 50%;
}
@media print, screen and (min-width: 768px) {
    .circleTitle {
        margin-bottom: 2em;
        padding-left: 1.1667em;
        font-size: 1.8rem;
    }
    .circleTitle:before {top: 6px;}
}
@media screen and (max-width: 767px) {
    .circleTitle {
        margin-bottom: 2.25em;
        padding-left: 1.3125em;
        font-size: 1.6rem;
    }
    .circleTitle:before {top: 5px;}
}

/* =======================================================
　titleUnderLeftLine
========================================================== */
* + .titleLeftUnderLine {margin-top:2em;}
.titleLeftUnderLine {
    margin-bottom: 1.0em;
    position: relative;
    padding-bottom: 0.75em;
    border-bottom: 1px solid #E6EDF1;
}
.titleLeftUnderLine span {
    position: relative;
    display: inline-block;
    padding-left: 0.75em;
    border-left-width: 2px;
    border-left-style: solid;
    text-decoration:none;
    color:#233036;
}
.titleLeftUnderLine.gradation span {border-left-width: 0;}
.titleLeftUnderLine.gradation span:before {
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:4px;
    height:100%;
    background: #18639F;
    background: -moz-linear-gradient(top,  #18639F 0%, #00A875 100%);
    background: -webkit-linear-gradient(top,  #18639F 0%,#00A875 100%);
    background: linear-gradient(to bottom,  #18639F 0%,#00A875 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#18639F', endColorstr='#00A875',GradientType=0 );
}
@media print, screen and (min-width: 768px) {
    .titleLeftUnderLine{font-size: 2.0rem;}
    .titleLeftUnderLine.gradation {font-size:2.2rem;}
    .titleLeftUnderLine .button {
		padding:0.7em 1em 0.6em 1.5em;
        float:right;
        margin-top:-5px;
    }
}
@media screen and (max-width: 767px) {
    .titleLeftUnderLine{font-size: 1.8rem;}
    .titleLeftUnderLine.gradation {font-size:2.0rem;}
    .titleLeftUnderLine.link {margin-bottom:4.5em;}
    .titleLeftUnderLine .button {
		padding:1.15em 2em;
        position:absolute;
        top:calc(100% + 1em) !important;
        display:block;
        margin:0 auto 1em;
        left:0;
        right:0;
        max-width:250px;
    }
    .titleLeftUnderLine .button:active,
    .titleLeftUnderLine .button:hover {
        top:calc(100% + 1em) !important;
    }
}

/* 色
-------------------------------------*/
/* 青 */
.titleLeftUnderLine.blue span{border-left-color: #0058C7;}

/* =======================================================
　titleSortLine
========================================================== */
* + .titleSortLine {margin-top:2.7273em;}
* + .titleSortLine.topWide {margin-top:4em;}
.titleSortLine{
    margin-bottom: 1em;
    position: relative;
    padding-bottom: 0.5em;
}
.titleSortLine.large {margin-bottom: 1.5em;}
.titleSortLine:before{
    content: "";
    display: block;
    position: absolute;
    top: calc(100% - 2px);
    width: 100%;
    height: 4px;
    max-width: 32px;
}
@media print, screen and (min-width: 768px) {
    .titleSortLine{font-size: 2.2rem;}
    .titleSortLine.large {font-size: 3rem;}
}
@media screen and (max-width: 767px) {
    .titleSortLine{font-size: 2.0rem;}
    .titleSortLine.large {font-size: 2.2rem;}
}
/* 色
-------------------------------------*/
/* グラデーション */
.titleSortLine.gradation:before{
    background: #0058C7;
    background: -moz-linear-gradient(left,  #0058C7 0%, #0BA0CF 100%);
    background: -webkit-linear-gradient(left,  #0058C7 0%,#0BA0CF 100%);
    background: linear-gradient(to right,  #0058C7 0%,#0BA0CF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0058C7', endColorstr='#0BA0CF',GradientType=1 );
}

/* =======================================================
    titleBg
========================================================== */
* + .titleBg {margin-top:2em;}
.titleBg{
    margin-bottom: 1.667em;
    padding: 0.8em;
    font-weight: bold;
}
.titleBg.small{
    padding: 0.8em;
    padding-left: 1.25em;
    padding-right: 1.25em;
}

@media print, screen and (min-width: 768px) {
    .titleBg{font-size: 1.8rem;}
    .titleBg.small{font-size: 1.3rem;}
}
@media screen and (max-width: 767px) {
    .titleBg{font-size: 1.6rem;}
    .titleBg.small{font-size: 1.3rem;}
}

/* 色
-------------------------------------*/
.titleBg.gray{background-color: #F5F8FA;}
.titleBg.blue{background-color: #0058C7; color: #fff;}
.titleBg.brown{background-color: #8E6E58; color: #fff;}
.titleBg.lightBlue{background-color: #5FC2E8; color: #fff;}
.titleBg.navy{background-color: #001C4C; color: #fff;}
.titleBg.amairo{background-color: #1381d6; color: #fff;}
.titleBg.gradation{
    background: #18639F;
    background: -moz-linear-gradient(left,  #005BAC 0%, #1381D6 50%, #1381D6 70%, #00A875 100%);
    background: -webkit-linear-gradient(left,  #005BAC 0%, #1381D6 50%,#1381D6 70%, #00A875 100%);
    background: linear-gradient(to right,  #005BAC 0%, #1381D6 50%,#1381D6 70%, #00A875 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#005BAC', endColorstr='#00A875',GradientType=1 );
    color: #fff;
}

/* =======================================================
    borderTitle
========================================================== */
.borderTitle {
    color: #001B64;
    font-weight: bold;
    border-bottom: 2px solid #001B64;
    padding-bottom: 0.6667em;
    line-height: 1.5;
}
.recommendBox + .borderTitle {
    margin-top: 3.3333em;
}

@media print, screen and (min-width: 768px) {
    .borderTitle {
        font-size: 1.8rem;
    }
}
@media screen and (max-width: 767px) {
    .borderTitle {
        font-size: 1.6rem;
    }
}

.scrollTable {
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
}
.scrollTable:not(.scrollVisible) {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.scrollTable:not(.scrollVisible)::-webkit-scrollbar {
    display: none;
}
.scrollTable table {
    width: 1430px;
}

#loadTable {
    transition: max-height ease 0.5s;
}


/* ====================================================
　スマホでスクロール
==================================================== */
/* スクロールヒント */
@media screen and (max-width: 767px) {
    .spScrollTable{position: relative;}
    .spScrollTable:before{
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 400px;
        max-height: 100%;
        background-image: url(../img/contents/scroll_hint.svg);
        background-size: 120px 120px;
        background-position: center center;
        background-repeat: no-repeat;
        opacity: 1;
        visibility: visible;
        transition: 0.3s;
        z-index: 10;
    }
    .spScrollTable.scroll:before{
        opacity: 0;
        visibility: hidden;
    }
}



/* ######################################################################################

　list　リスト

###################################################################################### */
/* =======================================================
    listStyle
========================================================== */
.listStyle{margin: 0 0 2em;}
ul.listStyle{margin-left:1em;}
* + .listStyle{margin-top: 1.5em;}
.listStyle li{
    position: relative;
    line-height: 1.4;
}
.listStyle li:before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
}
.listStyle li a{
    color: #111;
    padding-bottom:0.1em;
    text-decoration:none;
	position: relative;
    display: inline-block;
	overflow: inherit;
}

/* ドット
-------------------------------------*/
.listStyle.dot li {
    padding-left: 0.8889em;
    line-height: 1.5;
}
.listStyle.dot li + li {margin-top: 0.5em;}
.listStyle.dot li:before{
    top: 0.5556em;
    width: 6px;
    height: 6px;
    background: #005BAC;
    border-radius: 50%;
}
@media print, screen and (min-width: 768px) {
    .listStyle.dot li{
        font-size: 1.8rem;
    }
}
@media screen and (max-width: 767px){
    .listStyle.dot li{
        font-size: 1.6rem;
    }
}

/* =======================================================
    stepList
========================================================== */
.stepList {}
.stepList .step {
    position: relative;
    display: flex;
    border: 1px solid #EFEFEF;
    border-radius: 3px;
    font-weight: bold;
}
.stepList .step:before {
    content: "";
    display: block;
    min-height: 65px;
    background-repeat: no-repeat;
    background-size: 30px 58px;
    background-position: center center;
}
.stepList .step:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 20px;
    height: 10px;
    transform: translateY(-50%);
    background-image: url(../img/contents/stepArrow.svg);
}
.stepList .step:last-of-type:after {display: none;}

.stepList .step:nth-of-type(1):before {background-image: url(../img/contents/step1.svg);}
.stepList .step:nth-of-type(2):before {background-image: url(../img/contents/step2.svg);}
.stepList .step:nth-of-type(3):before {background-image: url(../img/contents/step3.svg);}
.stepList .step:nth-of-type(4):before {background-image: url(../img/contents/step4.svg);}
.stepList .step:nth-of-type(5):before {background-image: url(../img/contents/step5.svg);}
.stepList .step .inner {border-left: 1px solid #EFEFEF;}
.stepList .step .inner.single {display: flex; align-items: center;}
.stepList .step dd {font-weight: normal;}

@media print, screen and (min-width: 768px) {
    .stepList .step {
        padding-top: 1.4444em;
        padding-bottom: 1.4444em;
        padding-right: 1em;
        font-size: 1.8rem;
    }
    .stepList .step:before {
        width: 120px;
    }
    .stepList .step:after {
        bottom: -1.5em;
    }
    .stepList .step + .step {
        margin-top: 1.6667em;
    }
    .stepList .step .inner {
        padding-top: 0.5em;
        padding-bottom: 0.7222em;
        padding-left: 2.7778em;
    }
    .stepList .step dd {
        margin-top: 0.6667em;
        font-size: 1.5rem;
    }
}
@media screen and (max-width: 767px) {
    .stepList .step {
        padding-top: 1.375em;
        padding-bottom: 1.375em;
        padding-right: 1em;
        font-size: 1.6rem;
    }
    .stepList .step:before {
        width: 80px;
    }
    .stepList .step:after {
        bottom: -1.6875em;
    }
    .stepList .step + .step {
        margin-top: 1.875em;
    }
    .stepList .step .inner {
        padding-top: 0.5em;
        padding-bottom: 0.25em;
        padding-left: 1.25em;
    }
    .stepList .step dd {
        margin-top: 1em;
        font-size: 1.4rem;
    }
}

/* ######################################################################################

　recommendBox

###################################################################################### */
.recommendBox {
    background: #F5F8FA;
    border: 1px solid #001B64;
    border-radius: 3px;
    text-align: center;
    font-size: 1.8rem;
}
.recommendBox .title {font-weight: bold;}
.recommendBox .title:before,
.recommendBox .title:after {
    content: "";
    position: relative;
    top: 2px;
    display: inline-block;
    width: 2px;
    height: 1em;
    background: #001B64;
}
.recommendBox .title:before {
    transform: rotate(-47deg);
    margin-right: 1.2222em;
}
.recommendBox .title:after {
    transform: rotate(47deg);
    margin-left: 1.2222em;
}

@media print, screen and (min-width: 768px) {
    .recommendBox {
        padding: 1.1111em 0.5556em 1.0556em;
    }
    .recommendBox .title {
        font-size: 2.2rem;
    }
    .recommendBox .detail {
        margin-top: 0.5556em;
    }
}
@media screen and (max-width: 767px){
    .recommendBox {
        padding: 1.3333em 0.5556em 1.4444em;
    }
    .recommendBox .title {
        font-size: 1.8rem;
    }
    .recommendBox .detail {
        margin-top: 0.8889em;
        line-height: 1.5556;
    }
}

/* ######################################################################################

    contactBox

###################################################################################### */
.contactBox {
    margin-top: 5.7143em;
    padding: 1.8571em 1em 2.1429em;
    background: #FDF2F2;
    text-align: center;
}
.contactBox .title {
    margin-bottom: 1em;
    font-weight: bold;
}
@media print, screen and (min-width: 768px) {
	.contactBox .title{font-size: 2rem;}
}
@media screen and (max-width: 767px) {
	.contactBox .title{font-size: 1.6rem;}
}
/* ######################################################################################

    teacherBox

###################################################################################### */
@media print, screen and (min-width: 768px) {
    .teacherBox {
        display: flex;
    }
    .teacherBox .image {
        width: 115px;
        flex-shrink: 0;
    }
    .teacherBox .detailBox {
        flex: 1;
        padding-left: 25px;
        line-height: 2;
    }
    .teacherBox .detailBox dt {margin-bottom: 15px;}
}
@media screen and (max-width: 767px) {
    .teacherBox {position: relative;}
    .teacherBox .image {
        position: absolute;
        left: 0;
        top: 0;
        width: 115px;
    }
    .teacherBox .detailBox dt {
        margin-left: 130px;
        padding-top: 2.1538em;
        padding-bottom: 2.1538em;
        font-weight: normal;
        font-size: 1.3rem;
        line-height: 1.7692;
    }
    .teacherBox .detailBox dt .name {
        display: block;
        margin-bottom: 1.6em;
        font-weight: bold;
        font-size: 1.5rem;
    }
    .teacherBox .detailBox dd {
        margin-top: 1em;
        line-height: 2;
    }
}

/* ######################################################################################

    yellowBgBox

###################################################################################### */
.yellowBgBox {
    background: #F7FF13;
    font-weight: bold;
}

@media print, screen and (min-width: 768px) {
    .yellowBgBox {
        padding: 1.0667em 1.6667;
        font-size: 1.5rem;
    }
    .yellowBgBox.large {
        padding: 0.6667em 1em 0.8333em;
        font-size: 1.8rem;
    }
    .yellowBgBox.narrow {
        padding: 0.6667em 1.6667em 0.6667em;
        font-size: 1.5rem;
    }
}
@media screen and (max-width: 767px){
    .yellowBgBox {
        padding: 16px 25px;
        font-size: 1.5rem;
    }
    .yellowBgBox.large {
        padding: 12px 18px 15px;
        font-size: 1.6rem;
    }
    .yellowBgBox.narrow {
        padding: 0.6667em 1.6667em 0.6667em;
        font-size: 1.5rem;
    }
}

/* ######################################################################################

    mailBox

###################################################################################### */
* + .mailBox {margin-top: 30px;}
.mailBox {
    background: #001B64;
    border-radius: 3px;
    color: #fff;
    font-weight: bold;
}
.mailBox dd:before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 10px;
    margin-right: 6px;
    background-image: url(../img/contents/ico-mail.svg);
}
.mailBox dd a {
    color: #fff;
}
.mailBox dd span {font-weight: normal;}
@media print, screen and (min-width: 768px) {
    .mailBox {
        padding: 40px 50px 40px;
        font-size: 1.6rem;
    }
    .mailBox dl {display: flex;}
    .mailBox dt {padding-right: 44px;}
    .mailBox dd a:hover {opacity: 0.6;}
}
@media screen and (max-width: 767px) {
    .mailBox {
        padding: 1em 1em;
    }
    .mailBox dt {margin-bottom: 0.25em;}
    .mailBox dd {line-height: 1.5;}
}

/* ######################################################################################

    lisenceContents

###################################################################################### */
.lisenceContents p {font-size: 1.5rem; line-height: 1.8667;}
@media print, screen and (min-width: 768px) {
    .lisenceContents .moveTop {margin-top: -57px;}
}
@media screen and (max-width: 767px) {
    .mailBox {
        padding: 1em 1em;
    }
    .mailBox dt {margin-bottom: 0.25em;}
    .mailBox dd {line-height: 1.5;}
}


/* ######################################################################################

    blueBg

###################################################################################### */
.blueBg {
    margin-top: 1.7143em;
    margin-bottom: 1.9286em;
    background: #F5F8FA;
}
.blueBg .listStyle {margin-bottom: 0;}
@media print, screen and (min-width: 768px) {
    .blueBg {
        padding: 2em 1em 1.8571em 1.8571em;
    }
}
@media screen and (max-width: 767px){
    .blueBg {
        padding: 1.64229em 1em 2.42857em 0.1429em;
    }
}



/* ######################################################################################

    フォント周り

###################################################################################### */
/* フォント色
-------------------------------------*/
.colorRed {color: #CC0000;}
.colorBlue {color: #0058C7;}
.colorDarkBlue {color: #001B64;}

/* マーカー
-------------------------------------*/
.marker.yellow {background: #F7FF13;}
.marker.green {background: #55FE49;}
.marker.skyblue {background: #49E5FE;}
.marker.underline.yellow {background: linear-gradient(transparent 80%, #F7FF13 20%);}

/* ====================================================
    太字タイトル
==================================================== */
.bold {font-weight: bold;}
.boldStyle{font-weight: bold;}
.boldTitle{
    color: #111;
    font-size: 1.8rem;
    font-weight: bold;
}
.boldTitle.small{
    font-size: 1.6rem;
}

@media print, screen and (min-width: 768px) {
    .boldTitle.oswald{font-size: 5rem; letter-spacing: 0.05em;}
}
@media screen and (max-width: 767px) {
    .boldTitle.oswald{font-size: 3rem; letter-spacing: 0.05em;}
}


/* ######################################################################################

　フォントサイズ　fontsize

###################################################################################### */
.fontExSmall{font-size: 1.1rem;}
.fontSmall{font-size: 1.3rem; line-height: 2;}
.fontSmallNomal{font-size: 1.3rem !important;}
.fontUsually{font-size: 1.4rem;}
.fontRegular{font-size: 1.5rem;}
.fontLarge{font-size: 1.8rem; line-height: 1.675;}
.fontExLarge{font-size: 2.2rem; line-height: 1.65;}
.fontEExLarge{font-size: 2.6rem; line-height: 1.65;}
.fontEEExLarge{font-size: 6.0rem; line-height: 1.65;}

@media screen and (max-width: 767px) {
    .fontExLarge{font-size: 1.8rem; line-height: 1.65;}
    .fontEExLarge{font-size: 2.2rem; line-height: 1.65;}
	.fontEEExLarge{font-size: 3.6rem; line-height: 1.65;}
}


.fontBold{font-weight: bold;}
.textUnderLine{text-decoration: underline;}

/* フォントサイズ
-------------------------------------*/
@media print, screen and (min-width: 768px) {
    .fzSmall,
    p.fzSmall {font-size: 0.8667em;}
    .fzMiddleMiddle,
    p.fzMiddleMiddle {font-size: 1.8rem;}
    .fzMiddle,
    p.fzMiddle {font-size: 2.1rem;}
    .fzLargeMiddle,
    p.fzLargeMiddle {font-size: 2.2rem;}
    .fzLarge,
    p.fzLarge {font-size: 2.6rem;}
}
@media screen and (max-width: 767px){
    .fzMiddleMiddle,
    p.fzMiddleMiddle {font-size: 1.6rem;}
    .fzMiddle,
    p.fzMiddle {font-size: 1.6rem;}
    .fzLargeMiddle,
    p.fzLargeMiddle {font-size: 1.8rem;}
    .fzLarge,
    p.fzLarge {font-size: 2.0rem;}
}


/* ######################################################################################

　フォントカラー　fontcolor

###################################################################################### */
.colblack{ color:#111;}
.colgray{ color:#B9B9B9;}
.colmsgreen{ color:#0A6733;}
.colgreen{ color:#009935;}
.colskyblue{ color:#1381D6;}
.colred{color:#CC0000;}
.colpurple{color:#833C9D;}
.colnavy{color:#151D35;}

.fontred{color: #CC0000;}
.colyellow{color: #F0FF00;}

/* ######################################################################################

　下線　波線

###################################################################################### */
.underline-text { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.wavyline-text { text-decoration: underline wavy;text-underline-offset: 4px; }


/* マージン、その他
-------------------------------------*/
.mt0 {margin-top: 0!important;}
.mt1 {margin-top: 1em;}
.mt1_5 {margin-top: 1.5em;}
.mt2 {margin-top: 2em;}
.mt4 {margin-top: 4em;}
.mb0 {margin-bottom: 0!important;}
.mb0_5 {margin-bottom: 0.5em !important;}
.mb1 {margin-bottom: 1em;}
.mb2 {margin-bottom: 2em;}
.imageBox img + img {margin-top: 1em;}
.numberList li + li {margin-top: 0.5em;}
.numberList .iconNumber {margin-right: 0.25em;}
.iconNumber {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    padding-top: 0.15em;
    background: #005BAC;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    line-height: 1;
}

@media print, screen and (min-width: 768px) {
    .mbLarge {margin-bottom: 2em;}
    .imageBox {margin-bottom: 3.0714em;}
    .imageBox.narrow {margin-bottom: 1.7857em;}
}
@media screen and (max-width: 767px) {
    .mbLarge {margin-bottom: 1em;}
    .imageBox {margin-bottom: 1.5714em;}
    .imageBox.narrow {margin-bottom: 1em;}
}


/* ######################################################################################

　button　ボタン

###################################################################################### */
.button {
    opacity: 1;
    display: inline-block;
    position: relative;
    border: none;
    -webkit-appearance: none;
    box-shadow: none;
    border-radius: 0;
    background: #cccccc;
    font-size: 1.4rem;
    max-width: 100%;
    font-weight: normal;
    font-family: "Noto Sans JP", "游ゴシック Medium", "YuGothic Medium", "游ゴシック", YuGothic, "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
    color: #111;
    vertical-align: middle;
    line-height: 1;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    transition:opacity ease 0.3s;
}
.button:not(.disabled):hover {opacity: 0.8;}
.button.block {
    display: block;
    width: 100%;
}
.button.block + .block {margin-top: 0.5em;}

/* サイズ
-------------------------------------*/
@media print, screen and (min-width: 768px) {
    .button {
        padding: 1.7em 1em;
        font-size: 1.4rem;
    }
}
@media print, screen and (max-width: 767px) {
    .button {
        padding: 1.9231em 1.1538em;
        font-size: 1.3rem;
    }
}
@media print, screen and (min-width: 768px) {
    .button.small {
        padding: 17px 1em;
        font-size: 1.4rem;
    }
}
@media print, screen and (max-width: 767px) {
    .button.small {
        padding: 1em 2.5em;
        font-size: 1.3rem;
    }
}
@media print, screen and (min-width: 768px) {
    .button.large {
        padding: 1.5em 4em;
        font-size: 1.5rem;
        font-weight: bold;
    }
}
@media print, screen and (max-width: 767px) {
    .button.large {
        padding: 1.5em 4em;
        font-size: 1.5rem;
        font-weight: bold;
    }
}
.button.min280 {
    min-width: 280px;
}
.button.min250 {
    min-width: 250px;
}
.button.min167 {
    min-width: 167px;
}

.button.form-submit {
    -webkit-transition: background-color 0.5s ease;
    -moz-transition: background-color 0.5s ease;
    -o-transition: background-color 0.5s ease;
    transition: background-color 0.5s ease;
}
.button.next:not(.disabled) {
    background: #0073b3;
    color: #ffffff;
}
.button.after:after {margin-left: 0.5em;}
.button.before:before{margin-right: 0.5em;}
.button.ico.after.arrowR:after {margin-left: 2.6154em;}

.button.before:before, .button.after:after {
    display: inline-block;
    vertical-align: middle;
    font-family: FontAwesome;
    content: "";
    width: 1em;
    height: 1em;
}
.button.before.snap, .button.after.snap {
/*
    padding-left: 4em!important;
    padding-right: 4em!important;
*/
}
.button.ico {
  /* ≫ */
  /* ≪ */
  /* 人物チーム */
  /* GoogleMaps */
}
.button.ico.before:before, .button.ico.after:after {
    content: "";
    position: relative;
    width: 1em;
    height: 1em;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.button.ico.before.arrowR:before,
.button.ico.after.arrowR:after {
    top: -0.1em;
    background-image: url(../img/icon_arrow.svg);
    background-size: 12px 12px;
}
.button.ico.before.arrowR.blue:before,
.button.ico.after.arrowR.blue:after,
.button.ico.before.arrowR.gradation:before,
.button.ico.after.arrowR.gradation:after {
    background-image: url(../img/sub/ico_right_white.svg);
}
.button.ico.before.arrowR.blue.reserve:before,
.button.ico.after.arrowR.blue.reserve:after {
    background-image: url(../img/sub/ico_right_blue2.svg);
}

.button.ico.before.arrowU2:before,
.button.ico.after.arrowU2:after {
    background-image: url(../img/icon_up2_white.svg);
}
.button.ico.before.arrowD2:before,
.button.ico.after.arrowD2:after {
    background-image: url(../img/icon_down2_white.svg);
}


.button img.ico{
    vertical-align: middle;
    display: inline-block;
    margin: 0 5px;
}
.button.ico.before.youtube:before, .button.ico.after.youtube:after {
    background-image: url(../img/sub/ico-youtube.svg);
    width: 28px;
    height: 20px;
}

@media print, screen and (min-width: 768px) {
    .button.ico.before.arrowR.blue:hover:before,
    .button.ico.after.arrowR.blue:hover:after {background-image: url(../img/sub/ico_right_blue2.svg);}
    .button.ico.before.arrowR.blue.reserve:hover:before,
    .button.ico.after.arrowR.blue.reserve:hover:after,
	.button.ico.after.arrowR.white:hover:after{background-image: url(../img/sub/ico_right_white.svg);}
}
.button.before.snap:after, .button.before.snap:before, .button.after.snap:after, .button.after.snap:before {
    position: absolute;
    top: 50%!important;
    transform: translateY(-50%)!important;
}
.button.before.snap:after, .button.after.snap:after {right: 0.75em;}
.button.before.snap:before, .button.after.snap:before {left: 0.75em;}

.button.submit {
    background: #0058C7;
    color: #ffffff;
}
.button.submit {
    background: #0058C7;
    color: #ffffff;
}
.button.back {
    background: #888888;
    color: #ffffff;
}
.button.del,
.button.red {
    background: #cc0000;
    color: #ffffff;
}
.button.del:hover,
.button.red:hover {
    background: #001B64;
    color: #ffffff;
}
.button.disabled {
    box-shadow: none;
    cursor: no-drop;
    background: #cccccc;
    color: #aaaaaa;
}

/* 色
-------------------------------------*/
.button.blue {
    background: #005BAC;
    border-color: #005BAC;
    color: #fff;
}
@media print, screen and (min-width: 768px) {
}
.button.blue.reserve {
    background: #fff;
    border-color: #005BAC;
    color: #005BAC;
}
@media print, screen and (min-width: 768px) {
}

.button.white {
    background: #fff;
    border-color: #E2E4EF;
    color: #005BAC;
}
@media print, screen and (min-width: 768px) {
    .button.white:hover {
        background:  #005BAC;
        border-color: #005BAC;
        color: #fff;
        opacity: 1;
    }
}
.button.shadow {box-shadow: 0 0 3px rgba(0, 0, 0, 0.08);}
.button.round {border-radius: 25px;}
.button.corner {border-radius: 6px;}
.button.bold {font-weight: bold;}

.button[class^="autoZip"] {
    background: #def1f5;
    padding: 0.5em;
    vertical-align: middle;
    margin-left: 0.5em;
}

@media print, screen and (max-width: 767px) {
    .button.xs-block {
        display: block;
        width: 100%;
        margin: 1em 0;
    }
}
@media print, screen and (max-width: 991px) {
    .button.sm-block {
        display: block;
        width: 100%;
        margin: 1em 0;
    }
}
@media screen and (max-width: 1199px) {
    .button.md-block {
        display: block;
        width: 100%;
        margin: 1em 0;
    }
}
@media screen and (max-width: 9999px) {
    .button.lg-block {
        display: block;
        width: 100%;
        margin: 1em 0;
    }
}

/* ######################################################################################

　表：table

###################################################################################### */
/* ====================================================
　基本設定
==================================================== */
table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

caption {
    margin-bottom: 0.75em;
    text-align: left;
    font-size: 80%;
    font-weight: bold;
}

th, td {
    border-color: #E4E4E4;
    padding: 0.5em;
    text-align: left;
    color: #233036;
}

th span.vertical-rl {
    display: block;
    width: 1.5em;
    height: 200px;
    writing-mode: vertical-rl;
    letter-spacing: 12px;
}

@media print, screen and (min-width: 768px) {
    th {
        padding: 1.2143em 0.5em;
        vertical-align: top;
        font-size: 14px;
    }

    td {
        padding: 0.5em;
        font-size: 14px;
    }
    }
    @media screen and (max-width: 767px) {
    th {
        background: #f7f7f7;
        padding: 0.5em;
    }

    td {
        padding: 0.5em;
    }
}

/* ====================================================
　背景色
==================================================== */
th.gray, td.gray {
    background: #F8F8F8;
}
th.darkgray, td.darkgray {
    background: #F0F1F6;
}
th.paleblue, td.paleblue {
    background: #F0F6FC;
}
th.blue, td.blue {
    background: #0058C7;
    color: #fff;
}
th.darkblue, td.darkblue {
    background: #001B64;
    color: #fff;
}
th.green, td.green {
    background: #0EAF64;
    color: #fff;
}
th.palegreen, td.palegreen {
    background: #E6F7EF;
}
th.palered, td.palered {
    background: #FBEEEE;
}
th.yellow, td.yellow {
    background: #F7FF13;
}
th.purple, td.purple {
    background: #9E60C7;
    color: #fff;
}
th.deepGreen, td.deepGreen {
    background: #037741;
    color: #fff;
}

/* ====================================================
　寄せ
==================================================== */
th.left, td.left {
    text-align: left;
}
th.center, td.center {
    text-align: center;
}
th.right, td.right {
    text-align: right;
}
th.verticalM, td.verticalM {
    vertical-align: middle;
}
th.breakall, td.breakall {
    word-break: break-all;
}

@media screen and (max-width: 767px) {
    th.leftSp, td.leftSp {
        text-align: left;
    }
	.borderHorizon td {
    border-width: 0!important; }
}

/* ====================================================
　フォントサイズ
==================================================== */
th .small, td .small {
    font-size: 0.7143em;
}
th .smaller, td .smaller {
    font-size: 0.7857em;
}

/* ====================================================
　太さ
==================================================== */
th.bold, td.bold {
    font-weight: bold;
}

/* ====================================================
　幅
==================================================== */
th.w135, td.w135 {
    width: 135px;
}

/* ====================================================
　表示
==================================================== */
@media print, screen and (min-width: 768px) {
    table.sp {display: none;}
}
@media screen and (max-width: 767px) {
    table.pc {display: none;}
}

/* ====================================================
　囲み
==================================================== */
.borderHorizon th, .borderHorizon td {
    border-width: 1px 0;
}
.borderHorizon tr + tr td, .borderHorizon tr + tr th {
    border-top-width: 0;
}

.borderBox th, .borderBox td {
    border-width: 1px;
}
.borderBox tr + tr td, .borderBox tr + tr th {
    border-top-width: 0;
}
.borderBox th + th,
.borderBox th + td,
.borderBox td + td,
.borderBox td + td {
    border-left-width: 0;
}

/* ====================================================
　線種
==================================================== */
.borderSolid th {
    border-style: solid;
}
.borderSolid td {
    border-style: solid;
}
.borderSolid td:before {
    border-style: solid;
}

.borderDotted th {
    border-style: dotted;
}
.borderDotted td {
    border-style: dotted;
}
.borderDotted td:before {
    border-style: dotted;
}

.borderDashed th {
    border-style: dashed;
}
.borderDashed td {
    border-style: dashed;
}
.borderDashed td:before {
    border-style: dashed;
}

/* ====================================================
　**のときTHをサイドに作る
==================================================== */
table.cell-xs-create td:before, table.cell-sm-create td:before, table.cell-md-create td:before, table.cell-lg-create td:before {
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    border-width: 0 1px 0 0;
    border-color: #cccccc;
    background: #eeeeee;
    width: 6em;
    height: 100%;
    padding: 0.5em;
}
table.borderHorizon.cell-xs-create td:before, table.borderHorizon.cell-sm-create td:before, table.borderHorizon.cell-md-create td:before, table.borderHorizon.cell-lg-create td:before {
    border: none;
}

@media print, screen and (max-width: 767px) {
    /* ====================================================
    　xsのときcellをBlock
    ==================================================== */
    table.xs-block {
        display: block;
    }
    table.xs-block caption, table.xs-block thead, table.xs-block tbody, table.xs-block tr, table.xs-block th, table.xs-block td {
        display: block;
    }
    table.xs-block tr {
        margin-top: 0.5em;
    }
    table.xs-block tr + tr th {
        border-top-width: 1px;
    }
    table.xs-block th {
        padding-top: 0.6em;
        padding-bottom: 0.6em;
    }
    table.xs-block th + td,
    table.xs-block td + td {
        border-top-width: 0;
    }
    table.xs-block.borderBox td {
        border-left-width: 1px;
    }
    table.cell-xs-create th {
        display: none;
    }
    table.cell-xs-create td {
        position: relative;
        overflow: hidden;
        padding-left: 7em;
    }
    table.cell-xs-create td:before {
        content: attr(title);
    }
    table.cell-xs-create td:nth-of-type(1) {
        border-top-width: 1px;
    }
}
@media print, screen and (max-width: 991px) {
    /* ====================================================
    　smのときcellをBlock
    ==================================================== */
    table.sm-block {
        display: block;
    }
    table.sm-block caption, table.sm-block thead, table.sm-block tbody, table.sm-block tr, table.sm-block th, table.sm-block td {
        display: block;
    }
    table.sm-block tr {
        margin-top: 0.5em;
    }
    table.sm-block tr + tr th {
        border-top-width: 1px;
    }
    table.sm-block th {
        padding-top: 0.3em;
        padding-bottom: 0.3em;
    }
    table.sm-block th + td,
    table.sm-block td + td {
        border-top-width: 0;
    }
    table.sm-block.borderBox td {
        border-left-width: 1px;
    }
    table.cell-sm-create th {
        display: none;
    }
    table.cell-sm-create td {
        position: relative;
        overflow: hidden;
        padding-left: 7em;
    }
    table.cell-sm-create td:before {
        content: attr(title);
    }
    table.cell-sm-create td:nth-of-type(1) {
        border-top-width: 1px;
    }
}
@media screen and (max-width: 1199px) {
    /* ====================================================
    　mdのときcellをBlock
    ==================================================== */
    table.md-block {
        display: block;
    }
    table.md-block caption, table.md-block thead, table.md-block tbody, table.md-block tr, table.md-block th, table.md-block td {
        display: block;
    }
    table.md-block tr {
        margin-top: 0.5em;
    }
    table.md-block tr + tr th {
        border-top-width: 1px;
    }
    table.md-block th {
        padding-top: 0.3em;
        padding-bottom: 0.3em;
    }
    table.md-block th + td,
    table.md-block td + td {
        border-top-width: 0;
    }
    table.md-block.borderBox td {
        border-left-width: 1px;
    }
    table.cell-md-create th {
        display: none;
    }
    table.cell-md-create td {
        position: relative;
        overflow: hidden;
        padding-left: 7em;
    }
    table.cell-md-create td:before {
        content: attr(title);
    }
    table.cell-md-create td:nth-of-type(1) {
        border-top-width: 1px;
    }
}
@media screen and (max-width: 9999px) {
    /* ====================================================
    　lgのときcellをBlock
    ==================================================== */
    table.lg-block {
        display: block;
    }
    table.lg-block caption, table.lg-block thead, table.lg-block tbody, table.lg-block tr, table.lg-block th, table.lg-block td {
        display: block;
    }
    table.lg-block tr {
        margin-top: 0.5em;
    }
    table.lg-block tr + tr th {
        border-top-width: 1px;
    }
    table.lg-block th {
        padding-top: 0.3em;
        padding-bottom: 0.3em;
    }
    table.lg-block th + td,
    table.lg-block td + td {
        border-top-width: 0;
    }
    table.lg-block.borderBox td {
        border-left-width: 1px;
    }
    table.cell-lg-create th {
        display: none;
    }
    table.cell-lg-create td {
        position: relative;
        overflow: hidden;
        padding-left: 7em;
    }
    table.cell-lg-create td:before {
        content: attr(title);
    }
    table.cell-lg-create td:nth-of-type(1) {
        border-top-width: 1px;
    }
}

/* ====================================================
　カリキュラム表
==================================================== */
table.curriculum {
    width: 900px;
    line-height: 1.4286;
}
table.curriculum th,
table.curriculum td {
    font-size: 1.5rem;
    color: #1D3759;
}
table.curriculum .link {
    color: #1D3759;
    font-weight: bold;
    /*text-decoration: underline;*/
}
table.curriculum td {height: 80px;}
table.curriculum td.note {font-size: 1.4rem;}
table.curriculum th.purple,
table.curriculum th.deepGreen,
table.curriculum th.blue,
table.curriculum th.green{color: #FFF;}



.ballon {
    display: inline-block;
    width: 45px;
    height: 30px;
    margin-right: 4px;
    padding-top: 5px;
    background-image: url(../img/contents/ballon_right.svg);
    text-align: center;
    font-size: 1.1rem;
    color: #fff;
    font-weight: bold;
}

td.question {
    position: relative;
    padding-right: 60px;
}
td.question .ballonQuestion {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
    display: inline-block;
    width: 32px;
    height: 30px;
    background-image: url(../img/contents/ballon_question.svg);
    text-indent: -9999px;
}

/* ######################################################################################

　モーダル

###################################################################################### */
.modalButton,
.modalClose {
    cursor: pointer;
}

.modalContainer {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
}
.modalContainer .modalBg {
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,0.7);
}
.modalContainer .modalBox {
    position: absolute;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    background-color: #fff;
    font-size: 1.5rem;
    line-height: 1.8667;
}

.modalContainer .modalClose {
    position: absolute;
    right: 20px;
    top: 20px;
}
.modalContainer .modalBox .modalInner {
    overflow-y: scroll;
    max-height: calc(100vh - 260px);
    padding: 12px;
}

@media print, screen and (min-width: 768px) {
    .modalContainer .modalBox {
        max-width: 1200px;
        width: 80%;
        max-height: 80vh;
        padding: 58px 20px 40px;
    }
    .modalButton:hover,
    .modalClose:hover {
        opacity: 0.6;
    }
}
@media screen and (max-width: 767px) {
    .modalContainer .modalBox {
        width: calc(100% - 30px);
        max-height: calc(100% - 160px);
        padding: 3.5em 1.2em 1.5em;
    }
}

/* ====================================================
　黒線ボックス
==================================================== */
.blackborderbox{
	border: 2px solid #111111;
	border-radius: 3px;
	padding: 1em 1.5em 0.5em;
	margin-bottom: 1em;
}

/* ====================================================
　横並びボックス　80
==================================================== */
.horizontalBox{ display: flex;  flex-wrap: wrap;}
.horizontalBox dt,
.horizontalBox dd{display: flex;  align-items: center; /* ← 縦中央 */  padding: 0;margin-bottom: 15px;}
.horizontalBox dt{}
.horizontalBox dd{}

.horizontalBox dt.blue{background:#0058C7; padding: 0.5em 1.1em; font-weight: bold; color: #fff; text-align: center;font-size: 1.6rem;display: inline-block; }
.horizontalBox dt .marker{padding: 0.2em 0.7em; font-weight: bold; color: #111111; text-align: center;font-size: 1.6rem;  }

.horizontalBox dt.w60{width: 60px;align-items: flex-start;}
.horizontalBox dd.w60{width: calc(100% - 65px);padding-left: 15px; }

.horizontalBox dt.w80{width: 80px;}
.horizontalBox dd.w80{width: calc(100% - 85px);padding-left: 15px; }



/* ######################################################################################

    フォーム

###################################################################################### */
input[type="text"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="email"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="number"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    box-shadow: none;
    border: 1px solid #BABED1;
    border-radius: 4px;
    background-color: #ffffff;
    max-width: 100%;
    color: #16181B !important;
    font-family: Arial,"游ゴシック Medium", "YuGothic Medium", "游ゴシック", YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino kaku Gothic ProN", "メイリオ", sans-serif;
  }

  label.select select,
  textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    box-shadow: inset 1px 1px 3px transparent;
    border: 1px solid #BABED1;
    border-radius: 4px;
    background-color: #ffffff;
    max-width: 100%;
    color: #16181B !important;
    font-family: Arial,"游ゴシック Medium", "YuGothic Medium", "游ゴシック", YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino kaku Gothic ProN", "メイリオ", sans-serif;
  }

  @media print, screen and (min-width: 768px) {
    input[type="text"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="email"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="number"] {
      padding: 0.8em;
      font-size: 1.5rem;
    }
    label.select select,
    textarea {
      padding: 0.7em;
      font-size: 1.5rem;
		line-height: 1.6;
    }
  }
  @media screen and (max-width: 767px){
    input[type="text"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="email"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="number"] {
      padding: 0.75em 0.75em;
      font-size: 1.6rem;
    }
    label.select select,
    textarea {
      padding: 0.75em 0.75em;
      font-size: 1.6rem;
    }
  }


  input[type="text"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="email"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="number"] {
    height: auto;
  }

  textarea {
    width: 100%;
    min-height: 12em;
  }
  label.select{
    position: relative;
  }
  label.select select {
    padding-right: 3em;
    line-height: 1.2;
  }
  label.select select:not([multiple]) {
    box-shadow: none;
    margin: 0;
  }
  label.select:after {
    content: "";
    display: inline-block;
    position: absolute;
    pointer-events: none;
    top: 22%;
    right: 1em;
    width: 7px;
    height: 7px;
    border-bottom: 2px solid #BABED1;
    border-right: 2px solid #BABED1;
    transform: rotate(45deg);
  }
  label.select select::-ms-expand {
    display: none;
  }
  label.select option[disabled="disabled"] {
    background: #f0f0f0;
    color: #cccccc;
  }



  label.select.select2:after,
  label.select.select2:before {
    content: "";
    position: absolute;
    right: 1em;
    width: 7px;
    height: 7px;
    display: inline-block;
    pointer-events: none;
    transform: rotate(45deg);

  }
  label.select.select2:after {
    top: 56%;
    border-bottom: 2px solid #BABED1;
    border-right: 2px solid #BABED1;
  }
  label.select.select2:before {
    top: 10%;
    border-top: 2px solid #BABED1;
    border-left: 2px solid #BABED1;
  }


  input-placeholder {
    color: #BABED1 !important;
  }

  ::-webkit-input-placeholder {
    color: #BABED1 !important;
  }

  ::-moz-placeholder {
    color: #BABED1 !important;
  }

  ::-ms-input-placeholder {
    color: #BABED1 !important;
  }

  -webkit-input-placeholder {
    color: #BABED1 !important;
  }

  input:-ms-input-placeholder {
    color: #BABED1 !important;
  }

  -moz-placeholder {
    color: #BABED1 !important;
  }

  :-ms-input-placeholder {
    color: #BABED1 !important;
  }

  input[type="text"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="email"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="number"]:focus {
    border-color: #004BB1;
    background: #fff;
    box-shadow: none;
  }

  label.select select:focus,
  textarea:focus {
    border-color: #004BB1;
    background: #fff;
    box-shadow: none;
  }

  select:not([multiple]):focus {
    box-shadow: none;
  }

  input + label, input + span {
    cursor: pointer;
  }


  /* Searchアイコン付き input
  -------------------------------------*/
  .searchInput{position: relative; display: inline-block;}
  .searchInput input{padding-right: 3em;}
  .searchInput__icon{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 0;
        padding: 0.5em 1em;
        height: 100%;
    }
    .searchInput__icon img{vertical-align: middle;}


  /* 日付アイコン付き input
  -------------------------------------*/
  .dateInput{position: relative; display: inline-block;}
  .dateInput input{padding-right: 3em;}
  .dateInput__icon{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 0;
        padding: 0.5em 1em;
        height: 100%;
    }
    .dateInput__icon img{vertical-align: middle;}


  /* 送信ボタン付き input
  -------------------------------------*/
.inputButton{display: flex;}
.inputButton .inputButton__input{border-top-right-radius: 0px; border-bottom-right-radius: 0px;}
.inputButton .inputButton__button{
    background-color: #004BB1;
    border: none;
    border-radius: 0 4px 4px 0;
    color: #fff;
    padding: 0.75em;
    font-size: 1.6rem;
    font-weight: bold;
    font-family: Arial,"游ゴシック Medium", "YuGothic Medium", "游ゴシック", YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino kaku Gothic ProN", "メイリオ", sans-serif;
}
@media screen and (max-width: 767px) {
    .inputButton .inputButton__button{padding-top: 0.5em; padding-bottom: 0.5em;}
}


  /* ラジオボタン
  -------------------------------------*/
  .formItem__parts.block .radioButtonList {display: block;}
  .radioButtonList {display: flex; flex-wrap: wrap;}
  .radioButtonList__item{margin-right: 2em; margin-bottom: 0.5em;}
  .radioButtonList .radioButtonList__item:last-of-type {margin-right: 0;}
  @media print, screen and (min-width: 768px){
    }
    @media screen and (max-width: 767px) {
        .radioButtonList__item{margin-right: 2em; margin-bottom: 0.5em;}
    }

  .radioButtonList input[type="radio"] {
    display: none;
  }
  .radioButtonList input[type="radio"] + label,
  .radioButtonList input[type="radio"] + span {
    position: relative;
    padding-left: 35px;
    font-size: 1.4rem;
  }
  .radioButtonList input[type="radio"] + label:before,
  .radioButtonList input[type="radio"] + span:before {
    content: "";
    display: inline-block;
    position: absolute;
  }
  .radioButtonList input[type="radio"] + label:before,
  .radioButtonList input[type="radio"] + span:before {
    width: 30px;
    height: 30px;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    background: #fff;
    border-radius: 50%;
    border: 1px solid #BABED1;
  }

  .radioButtonList input[type="radio"] + label:after,
  .radioButtonList input[type="radio"] + span:after {
  width: 18px;
  height: 18px;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 6px;
    transform: translateY(-50%);
    border-radius: 50%;
  }
  .radioButtonList input[type="radio"]:checked + label:after, .radioButtonList input[type="radio"]:checked + span:after {
    content: "";
    background: #0060C1;
  }
  .radioButtonList input[type="radio"] + label, .radioButtonList  input[type="radio"] + span {
    cursor: pointer;
  }

@media all and (-ms-high-contrast: none) {/* IE */
    .radioButtonList input[type="radio"] + label:before,
    .radioButtonList input[type="radio"] + span:before {
    transform: translateY(-60%);
}
.radioButtonList input[type="radio"] + label:after,
.radioButtonList input[type="radio"] + span:after {
    transform: translateY(-70%);
}
}

  /* チェックボタン
  -------------------------------------*/
  .checkButtonList {display: flex; flex-wrap: wrap;}
  .checkButtonList__item{margin-right: 2em; margin-bottom: 0.5em;}
  @media print, screen and (min-width: 768px){
    }
    @media screen and (max-width: 767px) {
        .checkButtonList__item{margin-right: 2em; margin-bottom: 0.5em;}
    }


  .checkButtonList input[type="checkbox"] {
    display: none;
  }

  .checkButtonList input[type="checkbox"] + label,
  .checkButtonList input[type="checkbox"] + span {
    position: relative;
    display: inline-block;
    padding-left: 35px;
    font-weight: normal;
	text-wrap: nowrap;
  }
  .checkButtonList input[type="checkbox"] + label:before, .checkButtonList input[type="checkbox"] + span:before{
      content: "";
      display: inline-block;
      position: absolute;
      top: 50%;
      left: 0.25em;
      transform: translateY(-50%);
    }
    .checkButtonList input[type="checkbox"] + label:before, .checkButtonList input[type="checkbox"] + label:after, .checkButtonList input[type="checkbox"] + span:before, .checkButtonList input[type="checkbox"] + span:after{
      width: 1em;
      height: 1em;
      display: inline-block;
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
    }
    .checkButtonList input[type="checkbox"] + label:before, .checkButtonList input[type="checkbox"] + label:after, .checkButtonList input[type="checkbox"] + span:before, .checkButtonList input[type="checkbox"] + span:after{
      width: 1em;
      height: 1em;
      display: inline-block;
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
    }
    .checkButtonList input[type="checkbox"] + label:before, .checkButtonList input[type="checkbox"] + span:before {
      content: "";
      border-radius: 2px;
      background-color: #fff;
      border: 1px solid #BABED1;
      width: 30px;
      height: 30px;
    }
    .checkButtonList input[type="checkbox"]:checked + label:after, .checkButtonList input[type="checkbox"]:checked + span:after {
      content: "";
      left: 1px;
      background: url(../img/contents/share/ico-check_blue.svg) center no-repeat;
      background-size: 60%;
      background-color: #fff;
      width: 28px;
      height: 28px;
      border-radius: 4px;
    }
    .checkButtonList input[type="checkbox"] + label, .checkButtonList input[type="checkbox"] + span {
      cursor: pointer;

  }




  label.file:before {
    content: "ファイルを選択";
    display: inline-block;
    border-radius: 5px;
    background: #6C003C;
    color: #ffffff;
    padding: 0.5em 1em;
  }

.privacyPolicyBox  {
    color: #333333;
    font-size: 1.5rem;
}
.privacyPolicyBox .privacyText {
    background: #F5F8FA;
}
.privacyPolicyBox .scroll {
    overflow-y: scroll;
    font-size: 1.3rem;
    line-height: 1.8462;
}
.privacyPolicyBox .scroll h3,
.privacyPolicyBox .scroll h4 {
    margin-bottom: 20px;
    font-size: 1.6rem;
}
.privacyPolicyBox .scroll h3 {text-align: center;}
.privacyPolicyBox .scroll * + h3,
.privacyPolicyBox .scroll * + h4,
.privacyPolicyBox .scroll dl{
    margin-top: 2em;
}

.privacyPolicyBox .privacyCopy {
    margin-top: 30px;
    text-align: center;
}
.privacyPolicyBox .accept {
    text-align: center;
    font-weight: bold;
}
.privacyPolicyBox .accept .mwform-checkbox-field label {font-weight: bold;}
.privacyPolicyBox .accept .form-agreement.checkbox {
    position: relative;
    top: 4px;
    width: 20px;
    height: 20px;
    border: 1px solid #BABED1;
}
.privacyPolicyBox p.alignR {text-align: right;}

@media print, screen and (min-width: 768px) {
    .privacyPolicyBox .privacyText{
        padding: 10px 20px;
    }
    .privacyPolicyBox .scroll {
        height: 235px;
        padding: 35px 20px;
    }
}
@media screen and (max-width: 767px) {
    .privacyPolicyBox .privacyText{
        padding: 10px 20px;
    }
    .privacyPolicyBox .scroll {
        height: 235px;
        padding: 35px 20px;
    }
}



  .agreementBox {
    text-align: center;
  }
  .agreementBox label span{
    font-size: 1.5rem;
    font-weight: bold;
  }
  .agreementBox + .buttonBox {
    margin-top: 2em;
  }
  @media print, screen and (min-width: 768px) {
    .agreementBox {margin-top: 1.5em;}
    .agreementBox label span{font-size: 1.5rem;}
  }
  @media screen and (max-width: 767px) {
    .agreementBox {margin-top: 2em;}
    .agreementBox label span{font-size: 1.4rem;}
  }


input.inputError:focus,
input.inputError,
textarea.inputError{
    background: #FBEEEE;
    border-color: #CC0000;
}
p.error {
    display: block;
    margin: 0.5em 0 0;
    padding-left: 1em;
    text-indent: -1em;
    line-height: 1;
    font-size: 1.4rem;
    color: #ff0000;
    font-weight: bold;
}
p.error:before {
    content: "※";
}

  .checkConf {
    display: block;
  }

  .month-picker-year-table .ui-button {
    height: auto !important;
  }



@media print, screen and (min-width: 768px) {
    .input-size-m{width: 340px;}
  }
  @media screen and (max-width: 767px) {
    .input-size-m{width: 100%;}
  }