@charset "UTF-8";
/* CSS Document */

#wrap {
    margin-right: auto;
    margin-left: auto;
    text-align: left;
    min-width: 1000px;
}

#headwrap {
    clear: both;
    background-color: #00998f;
    background-image: url(../img/header-bg.png);
    background-repeat: no-repeat;
    background-position: center top;
    height: 280px;
}

#head {
    clear: both;
    width: 950px;
    margin-right: auto;
    margin-left: auto;
    position: relative;
}

#head h1 {
    text-align: center;
    color: rgba(255, 255, 255, 1.00);
    font-size: min(55px, 5vw);
    font-weight: 300;
    line-height: 70px;
    padding-top: 20px;
}

#head h1 span {
    font-size: 38px;
}

#head .shinsei {
    color: rgba(255, 255, 255, 1.00);
    font-size: 23px;
    border: 2px solid rgba(255, 255, 255, 1.00);
    border-radius: 20px;
    width: 110px;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    display: block;
    position: absolute;
    right: 30px;
    bottom: 10px;
}

#cont {
    background-image: url(../img/cont-bg01.png);
    background-repeat: no-repeat;
    background-position: center top;
    padding-top: 60px;
    background-color: rgba(255, 255, 255, 1.00);
}

.lead-txt {
    text-align: center;
    color: #00998f;
    font-size: 26px;
    line-height: 53px;
}

.cel440 {
    margin-top: 20px;
    font-size: 0;
}

.cel440 img {
    width: 95%;
    height: auto;
}

.midashi {
    display: block;
    text-align: center;
    align-content: center;
    /* margin: 30px auto 0; */
}

.midashi img {
    margin: 10px auto 0;
    width: 65%;
}

.mt-txt {
    display: block;
    line-height: 32px;
    font-size: 21px;
    width: 65%;
    margin-left: auto;
    text-align: left;
    margin-right: auto;
    color: #000 !important;
}

.mb-txt {
    margin-top: 25px;
    margin-bottom: 60px;
    color: #000;
    text-align: center;
}

.mk-txt {
    position: relative;
    display: inline-block;
    font-weight: 600;
    padding-bottom: 0;
    font-size: 21px;
    width: 58%;
    margin: 0px auto 60px;
}

.mk-txt::before,
.mk-txt::after {
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    font-size: 2.5em;
    color: rgb(0, 153, 143);
}

.mk-txt::before {
    content: "〈";
    right: 100%;
    margin-right: 4px;
}

.mk-txt::after {
    content: "〉";
    left: 100%;
    margin-left: 4px;
}

.cel440-box {
    display: inline-block;
    vertical-align: top;
    margin: 5px 35px;
    max-width: 440px;
    width: calc(49% - 70px);
}

.cel440-box img {
    width: 100%;
    height: auto;
}

.cel420 {
    margin-top: 20px;
    font-size: 0;
}

.cel420-box {
    display: inline-block;
    vertical-align: top;
    margin-right: 60px;
    margin-top: 15px;
    margin-bottom: 15px;
    max-width: 420px;
    font-size: 15px;
    width: calc(50% - 30px);
}

.cel420-box:nth-child(2n) {
    margin-right: 0;
}

.cel420 .cel420-box h4 {
    color: #FFFFFF;
    font-size: 21px;
    line-height: 50px;
    background-color: rgb(0, 153, 143, 0.7);
    text-align: center;
    padding: 0;
    margin-bottom: 10px;
}


.ab-sec02 h2 {
    background-image: url(../img/midashi01-bg.png);
}

.ab-sec03 h2 {
    background-image: url(../img/midashi02-bg.png);
}

.ab-sec04 h2 {
    background-image: url(../img/midashi03-bg.png);
}

.ab-sec02 h2,
.ab-sec03 h2,
.ab-sec04 h2 {
    background-repeat: no-repeat;
    background-position: center center;
    background-color: rgb(0, 153, 143);
    background-size: contain;
    font-size: 38px;
    font-weight: 300;
    color: #FFFFFF;
    text-align: center;
    padding: 32px 0;
    margin: 40px 0 30px;
}

.komidashi {
    color: #00998f;
    font-size: 30px;
    text-align: center;
    background-color: #F8F6DE;
    font-weight: 300;
    line-height: 60px;
    padding-bottom: 0px;
    margin-bottom: 25px;
}

.txtbox {
    margin-bottom: 40px;
}

.btn-area {
    padding-top: 20px;
    /* padding-bottom: 20px; */
    padding-bottom: 60px;
}

a.btn {
    display: inline-block;
    background-image: -webkit-linear-gradient(180deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: -moz-linear-gradient(180deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: -o-linear-gradient(180deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: linear-gradient(180deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    color: #B01447;
    text-decoration: none;
    padding-top: 5px;
    padding-right: 20px;
    padding-bottom: 5px;
    padding-left: 55px;
    border: 1px solid #CCCCCC;
    position: relative;
    font-size: 16px;
    transition: 0.5s;
    height: 40px;
    line-height: 40px;
    margin-right: 45px;
    vertical-align: top;
}

a.btn:before {
    content: "▶";
    position: absolute;
    left: 15px;
    top: 10%;
    color: #fff;
}

a.btn-none {
    display: inline-block;
    background: rgba(241, 241, 241, 1.00);
    color: #929292;
    text-decoration: none;
    padding-top: 5px;
    padding-right: 20px;
    padding-bottom: 5px;
    padding-left: 55px;
    border: 1px solid #CCCCCC;
    position: relative;
    font-size: 16px;
    transition: 0.5s;
    height: 40px;
    line-height: 40px;
    margin-right: 45px;
    vertical-align: top;
}

a.btn-none:before {
    content: "▶";
    position: absolute;
    left: 15px;
    top: 10%;
    color: #929292;
}

a.btn-gyo2 {
    display: inline-block;
    background-image: -webkit-linear-gradient(180deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: -moz-linear-gradient(180deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: -o-linear-gradient(180deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: linear-gradient(180deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    color: #B01447;
    text-decoration: none;
    padding-top: 15px;
    padding-right: 20px;
    padding-bottom: 5px;
    padding-left: 45px;
    border: 1px solid #CCCCCC;
    position: relative;
    font-size: 16px;
    transition: 0.5s;
    height: 60px;
    line-height: 24px;
    margin-right: 25px;
    vertical-align: top;
}

a.btn-gyo2:before {
    content: "▶";
    position: absolute;
    left: 15px;
    top: 35%;
    color: #fff;
}

a.btn:last-child {
    margin-right: 0px;
}

a.btn:hover {
    background-image: -webkit-linear-gradient(0deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: -moz-linear-gradient(0deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: -o-linear-gradient(0deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: linear-gradient(0deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
}

a.btn-gyo2:hover {
    background-image: -webkit-linear-gradient(0deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: -moz-linear-gradient(0deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: -o-linear-gradient(0deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
    background-image: linear-gradient(0deg, rgba(241, 241, 241, 1.00) 0%, rgba(212, 212, 212, 1.00) 99.48%);
}


/* テーブル全体のスタイル */
.ab-tbl {
    width: 100%;
    margin: 30px auto 52px;
    border-right: 2px solid #6b6b6b;
    border-collapse: collapse;
    /* font-feature-settings: "palt"; */
}

/* ヘッダーセルとデータセルの共通スタイル */
.ab-tbl th,
.ab-tbl td {
    padding: 0 15px;
}

.ab-tbl th {
    border: 2px solid #6b6b6b;
}

.ab-tbl td {
    border: 1px solid #6b6b6b;
}

/* ヘッダーセルのスタイル */
.ab-tbl th {
    background-color: #F8F6DE;
    font-size: 22px;
    line-height: 62px;
    text-align: center;
}

/* でーたせるのスタイル */
.ab-tbl td {
    font-size: 19px;
    line-height: 38px;
    color: #000;
    border-left: 2px solid #6b6b6b;
    border-bottom: 1px solid #6b6b6b;
}

/* 最後の行のセルに下の境界線を追加  */
.ab-tbl td.last {
    border-bottom: 2px solid #6b6b6b;
}

/* セルの左余白を調整 */
.ab-tbl .group {
    padding-left: 6%;
}

/* 科目区分ヘッダーの共通スタイル */
.ab-tbl .clr {
    color: #fff;
    font-size: 22px;
    line-height: 34px;
}

/* 各科目区分ごとの色指定 */
.ab-tbl .clr1 {
    background-color: #0a8caa;
}

.ab-tbl .clrc {
    background-color: hsl(191, 89%, 35%, 0.1);
}

.ab-tbl .clrc a {
    text-decoration: underline;
    transition: color 0.3s ease;
    color: #0a8caa;
}

.ab-tbl .clrc a:hover {
    color: #08bfe8;
    text-decoration: none;
}

.ab-tbl .clra {
    background-color: hsl(191, 89%, 35%, 0.1);
}

/* 基礎科目 */
.ab-tbl .clr2 {
    background-color: #5977b4;
}

.ab-tbl .clrr {
    background-color: hsl(220, 38%, 53%, 0.1);
}

.ab-tbl .clrr a {
    transition: color 0.3s ease;
    color: #5977b4;
    text-decoration: underline;
}

.ab-tbl .clrr a:hover {
    color: #4a90e2;
    text-decoration: none;
}

.ab-tbl .clrb {
    background-color: hsl(220, 38%, 53%, 0.1);
}

/* 応用科目 */
.ab-tbl .clr3 {
    background-color: #00998f;
}

.ab-tbl .clrk {
    background-color: hsl(176, 100%, 30%, 0.1);
}


.ab-tbl .clrk a {
    transition: color 0.3s ease;
    color: #00998f;
    text-decoration: underline;
}

.ab-tbl .clrk a:hover {
    color: #00c6b3;
    text-decoration: none;
}


.ab-tbl .clru {
    background-color: hsl(176, 100%, 30%, 0.1);
}

.ab-tbl .clrs {
    font-weight: 300;
    color: #000;
}


/* 各カラムの幅を指定 */
.ab-tbl th:nth-child(1) {
    width: 21.11%;
}

.ab-tbl th:nth-child(2) {
    width: 37.77%;
}

.ab-tbl th:nth-child(3),
.ab-tbl th:nth-child(4) {
    width: 19.55%;
}



.img-curriculum {
    /* width: 100%; */
    margin: -20px auto 62px;
}


.caption {
    font-size: 14px;
    margin-top: 40px;
}


/* -----------------------------------
                   footer
-------------------------------------*/
.footer {
    margin-top: 70px;
    background-color: #B01447;
}

footer div::after {
    display: none;
}

.footer-logo {
    float: left;
}

.footer-logo img {
    width: min(100%, 300px);
    vertical-align: baseline;
}


.footer-wrap {
    display: grid;
    grid-template-columns: 2fr 1fr;
    font-family: "Noto Sans JP", serif;
    /* padding-top: 2.5em;
    padding-bottom: 2.5em; */
    padding-top: 55px;
    padding-bottom: 55px;
    color: #FFFFFF;
}

.footer-info {
    display: flex;
    justify-content: space-around;
    align-items: last baseline;
    flex-wrap: nowrap;
}

.footer-adress {
    text-align: left;
    font-size: clamp(0.75rem, 0.482rem + 0.57vw, 0.875rem);
}

.footer-cp {
    float: right;
    font-size: clamp(0.75rem, 0.482rem + 0.57vw, 0.875rem);
    padding-top: 70px;
}

/* 共通 */
.inner900 {
    width: 100%;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.inner950 {
    width: 90%;
    max-width: 950px;
    margin-left: auto;
    margin-right: auto;
}

.inner1020 {
    width: 90%;
    max-width: 1020px;
    margin-left: auto;
    margin-right: auto;
}

.inner1100 {
    width: 100%;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

.pc-none {
    display: none;
}

.sp-none {
    display: block;
}

.centertxt {
    text-align: center;
}

.lefttxt {
    text-align: left;
}

.righttxt {
    text-align: right;
}