#container.mineral-pro ,
.inner-mineral-pro {
    line-height: 1.8;
}
strong {
    font-weight: bold;
}
small {
    font-size: 14px;
}
/*----------------------------------------
 *
 * パソコン・タブレット向け
 *
----------------------------------------*/

.inner-mineral-pro {
    margin: 0 auto;
    width: 1024px;
}
/* ページ内移動でメニューの重なりを修正 */
a.anchor {
    margin: -80px 0 0 0;
    padding: 80px 0 0 0;
}
#page-header-main {
    border-bottom: none;
}
#catch {
    padding-top: 80px;
}
body {
    background-image: url(../images/bg-nuno.jpg);
}


/*----------------------------------------
* catch
----------------------------------------*/
#catch {
    text-align: center;
    line-height: 0;
}
/*----------------------------------------
* mineral-01
----------------------------------------*/
#mineral-01 {
    /*background-color: #fff;*/
    padding: 3em 0 0 0;
    text-align: center;
    line-height: 0;
}
#mineral-01 img {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
/*----------------------------------------
* mineral-02
----------------------------------------*/
#mineral-02 {
    padding: 3em 0 0 0;
    line-height: 0;
}
#mineral-02 img {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
/*----------------------------------------
* mineral-03
----------------------------------------*/
#mineral-03 {
    /*background-color: #fff;*/
    padding: 3em 0;
    text-align: center;
    line-height: 0;
}
#mineral-03 img {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
/*----------------------------------------
* about-ouyou
----------------------------------------*/
#about-ouyou {
    position: relative;
    line-height: 0;
}
#about-ouyou img {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
#about-ouyou .greeting {
    position: absolute;
    top: 480px;
    left: 0;
    display: flex;
    justify-content: space-between;
    padding: 24px 7% 0 10%;
    line-height: 1.8;
    box-sizing: border-box;
}
#about-ouyou .greeting .image img {
    width: 100%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}
#about-ouyou .greeting .image {
    width: 15%;
    text-align: center;
    line-height: 1.5;
}
#about-ouyou .greeting .kansyu {
    padding-top: 1em;
    display: block;
}
#about-ouyou .greeting h1 {
    font-size: 20px;
}
#about-ouyou .greeting .kana {
    color: gray;
}
#about-ouyou .greeting .text {
    width: 75%;
}
/*----------------------------------------
* program_header
----------------------------------------*/
#program_header {
    text-align: center;
    padding: 3em 0 0 0;
}
#program_header .inner-mineral-pro {
    padding: 1em 0;
    background-color: #fff;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
#program_header img {
    display: inline-block;
    padding: 0;
    margin: 0;
}
/*----------------------------------------
* program
----------------------------------------*/
#program {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#program h1.header-title {
    width: 100%;
    font-size: 30px;
    color: #754c24;
    padding: 24px 0;
}
#program h1.header-title span {
    display: inline-block;
    padding-left: 1em;
}
#program .chapter {
    width: 49%;
    padding: 2em;
    margin-bottom: 24px;
    box-sizing: border-box;
    background-color: #fff;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
#program .number {
    width: 3em;
    font-size: 24px;
    line-height: 1.4;
    color: #42b7c2;
    display: block;
    text-align: center;
    border-bottom: 2px solid #42b7c2;
    margin: 0 auto;
}
#program h1 {
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    padding: 18px 0 6px 0;
}
@media screen and (min-width: 768px) and (max-width: 5000px) {
    #program p.text {
        height: 12em;
    }
}
#program .profile {
    display: flex;
    justify-content: space-between;
    padding: 2em 0 0 0;
    border-top: thin solid #ccc;
}
#program .profile h2 {
    font-size: 18px;
    padding-bottom: 6px;
}
#program .profile .text {
    width: 76%;
    font-size: 14px;
    line-height: 1.6;
}
#program .profile ul {
    padding-top: 12px;
}
/*マーカーの色*/
#program .profile li { 
    padding-left: 1em; 
    text-indent: -1em;
}
#program .profile li:before {
    content: "• ";
    color: #42b7c2;
}
#program .profile img {
    width: 100%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}
#program .profile .image {
    width: 20%;
}
#program .profile a {
    display: inline;
    text-decoration: underline;
}
#program .profile a:hover {
    color: #42b7c2;
}
/*----------------------------------------
* program_footer
----------------------------------------*/
#program_footer {
    text-align: center;
    padding-bottom: 24px;
}
/*----------------------------------------
* profile
----------------------------------------*/
#profile {
    display: flex;
    justify-content: space-between;
    background-color: #fff;
    padding: 3em 2em;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
#profile .ifca {
    padding-right: 2em;
    border-right: thin solid #ccc;
}
#profile .teacher-img {
    padding-left: 2em;
}
#profile .teacher {
    font-size: 14px;
    line-height: 1.6;
    padding-left: 2em;
}
#profile .teacher h1 {
    font-size: 22px;
}
#profile .teacher p {
    padding: 1em 0;
}
#profile .teacher ul {
    padding: 1em 0;
}
/*マーカーの色*/
#profile .list li { 
    padding-left: 1em; 
    text-indent: -1em;
}
#profile .list li:before {
    content: "• ";
    color: #42b7c2;
}
/*----------------------------------------
* about-ifca
----------------------------------------*/
#about-ifca-area {
    background-color: #fff;
    margin: 3em auto;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
#page-guide-area {
    padding-top: 2em;
}
#about-ifca-area img.title-otoku {
    -webkit-border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    -o-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0;
}
#about-ifca-area .guide {
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
#about-ifca-area .guide h3 {
    font-size: 20px;
}
#about-ifca-area .guide .box1 {
    width: 55%;
}
#about-ifca-area .guide .box1 table {
    width: 100%;
    margin-bottom: 2em;
}
#about-ifca-area .guide .box2 {
    width: 40%;
}

#page-guide-area h2.title {
    padding-top: 2em;
    font-size: 30px;
}
#about-ifca-area .flow {
    line-height: 1.6;
    padding-bottom: 0;
}
#about-ifca-area .flow p:nth-of-type(3){
    padding-bottom: 1em;
}
#about-ifca-area .flow h4 {
    text-align: center;
    padding-bottom: 2em;
}

#mineral-link img {
    width: 100%;
}

/*----------------------------------------
* botton
----------------------------------------*/
#page-guide-area .botton {
    border-top: 1px solid #ccc;
    padding: 3em 0;
    display: flex;
    justify-content: center;
}
#page-guide-area .botton .request,
#page-guide-area .botton .apply {
    width: 48%;
    text-align: center;
}
/*
* 各講座申し込みボタン
*/
/*上級講座あり*/
.botton#mineral-pro {
    display: flex;
    justify-content: space-between;
}
/*上級講座なし*/
.botton.btn2#mineral-pro {
    justify-content: space-around;
}
.botton#mineral-pro div {
    width: 32%;
    text-align: center;
    padding-bottom: 1em;
    border: 1px solid #ccc;
    -webkit-border-radius: 5px;/* for Safari and Chrome */
    -moz-border-radius: 5px; /* for Firefox */
    -o-border-radius: 5px; /* for opera */
    border-radius: 5px;
}
#mineral-pro.botton img {
    width: 100%;
    -webkit-border-radius: 5px 5px 0 0;/* for Safari and Chrome */
    -moz-border-radius: 5px 5px 0 0; /* for Firefox */
    -o-border-radius: 5px 5px 0 0; /* for opera */
    border-radius: 5px 5px 0 0;
}
#mineral-pro.botton h2 {
    font-size: 16px;
    padding-top: 1em;
}
#mineral-pro.botton a {
    display: block;
    width: 75%;
    height: 40px;
    padding: 0;
    margin: 1em auto;
    font-size: 16px;
    line-height: 16px;
    color: #fff;
    background:  #ff7bac;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
    align-items: center; /* 縦方向中央揃え */
    -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
    justify-content: center; /* 横方向中央揃え */
    -webkit-border-radius: 5px;/* for Safari and Chrome */
    -moz-border-radius: 5px; /* for Firefox */
    -o-border-radius: 5px; /* for opera */
    border-radius: 5px;
}

/*----------------------------------------
* footer-area
----------------------------------------*/
#about-ifca {
    background-color: #fff;
    padding-top: 1em;
}
#about-ifca .box {
    background-color: #fff;
    padding: 0;
}
#footer {
}
#footer.page {
    background-color: #fff;
    /*background-color: #fafafa;*/
}




/*----------------------------------------
 *
 * スマホ向け
 *
----------------------------------------*/
@media screen  and (max-width: 767px) {
    .inner-mineral-pro {
        padding: 50px 0 0 0; /* メニューの高さと揃える */
        width: 100%;
    }
    body {
        background-image: none;
    }
    /*----------------------------------------
    * catch
    ----------------------------------------*/
    #catch {
        padding: 50px 0 0 0;
        margin: 0;
        line-height: 0;
    }
    #catch img {
        width: 100%;
    }
    /*----------------------------------------
    * mineral-01
    ----------------------------------------*/
    #mineral-01 {
        padding: 2em 0 0 0;
        margin: 0;
        line-height: 0;
    }
    #mineral-01 img {
        width: 100%;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
    } 
    /*----------------------------------------
    * mineral-02
    ----------------------------------------*/
    #mineral-02 {
        padding: 0;
        margin: 0;
        line-height: 0;
    }
    #mineral-02 img {
        width: 100%;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
    }
    /*----------------------------------------
    * mineral-03
    ----------------------------------------*/
    #mineral-03 {
        padding: 0;
        margin: 0;
        line-height: 0;
    }
    #mineral-03 img {
        width: 100%;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
    } 
    /*----------------------------------------
    * about-ouyou
    ----------------------------------------*/
    #about-ouyou .voice {
        padding: 0;
        margin: 0;
        line-height: 0;
    }
    #about-ouyou .voice img {
        width: 100%;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
    }
    #about-ouyou .greeting {
        background-image: url(../images/bg-nuno.jpg);
        padding: 2em 5%;
        display: block;
        position: sticky;
    }
    #about-ouyou .greeting .image img {
        width: 100%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -o-border-radius: 50%;
        border-radius: 50%;
    }
    #about-ouyou .greeting .image {
        width: 35%;
        text-align: center;
        line-height: 1.5;
        margin: 0 auto;
    }
    #about-ouyou .greeting .kansyu {
        padding-top: 1em;
        display: block;
    }
    #about-ouyou .greeting h1 {
        font-size: 20px;
    }
    #about-ouyou .greeting .kana {
        color: gray;
    }
    #about-ouyou .greeting .text {
        padding-top: 2em;
        width: 100%;
    }
    
    /*----------------------------------------
    * program_header
    ----------------------------------------*/
    #program_header {
        padding: 0 0 1em 0;
        margin: 0;
        text-align: center;
    }
    #program_header .inner-mineral-pro {
        padding: 0 5%;
        margin: 0;
    }
    #program_header img {
        display: block;
        padding: 0;
        margin: 0 auto;
        width: 85%;
        
    }
    #program_header img:nth-of-type(2) {
        padding: 0;
        width: 70%;
    }
    /*----------------------------------------
    * program
    ----------------------------------------*/
    #program {
        background-image: url(../images/bg-nuno.jpg);
        padding: 2em 5% 0.5em 5%;
    }
    #program h1.header-title {
        width: 100%;
        font-size: 5vw;
        color: #754c24;
        text-align: center;
        padding: 0 0 1em 0;
    }
    #program h1.header-title span {
        display: block;
        padding: 0;
    }
    #program .chapter {
        width: 100%;
        padding: 2em 1.5em;
        margin-bottom: 2em;
        box-sizing: border-box;
        background-color: #fff;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        -o-border-radius: 10px;
        border-radius: 10px;
    }
    #program .number {
        width: 3em;
        font-size: 5vw;
        line-height: 1.4;
        color: #42b7c2;
        display: block;
        text-align: center;
        border-bottom: 2px solid #42b7c2;
        margin: 0 auto;
    }
    #program h1 {
        font-size: 4vw;
        font-weight: bold;
        text-align: center;
        padding: 18px 0 6px 0;
    }
    #program .text {
        padding: 0 0 2em 0;
    }
    #program .profile {
        display: block;
        padding: 2em 0 0 0;
        border-top: thin solid #ccc;
    }
    #program .profile .image {
        width: 30%;
        margin: 0 auto;
    }
    #program .profile .image img {
        width: 100%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -o-border-radius: 50%;
        border-radius: 50%;
    }
    #program .profile h2 {
        font-size: 16px;
        padding-bottom: 6px;
        text-align: center;
    }
    #program .profile .text {
        width: 100%;
        font-size: 14px;
        line-height: 1.6;
        padding: 0;
    }
    #program .profile ul {
        padding-top: 12px;
    }
    /*マーカーの色*/
    #program .profile li { 
        padding-left: 1em; 
        text-indent: -1em;
    }
    #program .profile li:before {
        content: "• ";
        color: #42b7c2;
    }
    #program .profile a {
        display: inline;
        text-decoration: underline;
    }
    #program .profile a:hover {
        color: #42b7c2;
    }
    #program .profile ul br {
        display: none;
    }
    /*----------------------------------------
    * program_footer
    ----------------------------------------*/
    #program_footer {
        text-align: center;
        background-image: url(../images/bg-nuno.jpg);
        padding: 0 5% 2em 5%;
    }
    #program_footer img {
        width: 90%;
    }
    /*----------------------------------------
    * profile
    ----------------------------------------*/
    #profile {
        display: block;
        padding: 2em 5%;
    }
    #profile .ifca {
       display: none;
    }
    #profile .teacher-img {
        width: 40%;
        margin: 0 auto;
    }
    #profile .teacher-img img {
        width: 100%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -o-border-radius: 50%;
        border-radius: 50%;
    }
    #profile .teacher {
        font-size: 14px;
        line-height: 1.6;
        text-align: center;
        width: 100%;
        padding: 0;
        margin: 0;
    }
    #profile .teacher h1 {
        font-size: 18px;
        
    }
    #profile .teacher p {
        padding: 1em 0;
        text-align: left;
    }
    #profile .teacher ul {
        padding: 1em 0;
        text-align: left;
    }
    /*マーカーの色*/
    #profile .list li { 
        padding-left: 1em; 
        text-indent: -1em;
    }
    #profile .list li:before {
        content: "• ";
        color: #42b7c2;
    }
    /*----------------------------------------
    * about-ifca
    ----------------------------------------*/
    #about-ifca-area {
        background-color: #fff;
        padding: 0;
        margin: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
    }
    #about-ifca-area img.title-otoku {
        width: 100%;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
    }
    #page-guide-area {
        padding-top: 1em;
    }
    
    #about-ifca-area .guide {
        padding: 0;
        display: block;
    }
    #about-ifca-area .guide h3 {
        font-size: 20px;
    }
    #about-ifca-area .guide .box1 {
        width: 100%;
    }
    #about-ifca-area .guide .box1 table {
        width: 100%;
        margin-bottom: 2em;
    }
    #page-guide-area .box2.warm-up {
        width: 75%;
        padding: 1em 0;
        margin: 0 auto;
    }
    #page-guide-area .box2.btn-mineral {
        width: 80%;
        padding: 1em 0;
        margin: 0 auto;
    }
    #page-guide-area .box2 img {
        width: 100%;
    }
    /* title */
    #page-guide-area h2.title {
        font-size: 1.1em;
        padding: 2em 0 1em 0;
        line-height: 60px;
        border: none;
    }
    #page-guide-area h2.title span {
        width: 60px;
        height: 60px;
    }
    #about-ifca-area .flow {
        line-height: 1.6;
        padding-bottom: 0;
    }
    #about-ifca-area .flow p:nth-of-type(3){
        padding-bottom: 1em;
    }
    #about-ifca-area .flow h4 {
        text-align: center;
        padding-bottom: 2em;
    }
    #mineral-link img {
        width: 100%;
    }
    /*----------------------------------------
    * botton
    ----------------------------------------*/
    #page-guide-area .botton {
        border-top: none;
        padding: 1em 0;
        display: block;
    }
    #page-guide-area .botton .request,
    #page-guide-area .botton .apply {
        width: 80%;
        text-align: center;
        box-sizing: border-box;
    }
    /*
    * 各講座申し込みボタン
    */
    .botton#mineral-pro {
    }
    .botton#mineral-pro div {
        width: 80%;
        text-align: center;
        padding-bottom: 0.5em;
        border: 1px solid #ccc;
        -webkit-border-radius: 5px;/* for Safari and Chrome */
        -moz-border-radius: 5px; /* for Firefox */
        -o-border-radius: 5px; /* for opera */
        border-radius: 5px;
        margin: 1em auto 0 auto;
    }
    #mineral-pro.botton img {
        width: 100%;
        -webkit-border-radius: 5px 5px 0 0;/* for Safari and Chrome */
        -moz-border-radius: 5px 5px 0 0; /* for Firefox */
        -o-border-radius: 5px 5px 0 0; /* for opera */
        border-radius: 5px 5px 0 0;
    }
    #mineral-pro.botton h2 {
        font-size: 16px;
        padding-top: 0.5em;
    }
    #mineral-pro.botton a {
        display: block;
        width: 75%;
        height: 40px;
        padding: 0;
        margin: 0.5em auto;
        font-size: 16px;
        line-height: 16px;
        color: #fff;
        background:  #ff7bac;
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
        align-items: center; /* 縦方向中央揃え */
        -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
        justify-content: center; /* 横方向中央揃え */
        -webkit-border-radius: 5px;/* for Safari and Chrome */
        -moz-border-radius: 5px; /* for Firefox */
        -o-border-radius: 5px; /* for opera */
        border-radius: 5px;
    }

    /*----------------------------------------
    * footer-area
    ----------------------------------------*/
    #about-ifca {
        background-color: #fff;
        padding-top: 1em;
    }
    #about-ifca .box {
        background-color: #fff;
        padding: 0;
    }
    #footer {
    }
    #footer.page {
        background-color: #fff;
        /*background-color: #fafafa;*/
    }
    
}



/*
* ページによってカラーの変更
* header navi　と色を揃える
*各ページのスタイルシート一番下へ
*/
/*----------------------------------------
* パソコン向け
----------------------------------------*/
@media screen and (min-width: 768px) and (max-width: 5000px) {
    #page-header-main .nav li.btn a.request,
    .botton input#request {
        background: #61C359;/*背景色*/
    }
    #page-header-main .nav li.btn a.apply,
    .botton input#apply {
        background:  #ff7bac;/*背景色*/
    }
}

/*----------------------------------------
* スマホ向け
----------------------------------------*/
@media screen  and (max-width: 767px) {
    /* 折りたたみ */
    #page-header-main .nav li.btn a.request {
        color: #61C359;/*文字の色*/
        background-color: rgba(255,255,255,0);
        padding: 0;
        margin: 0;
    }
    #page-header-main .nav li.btn a.apply {
        color:  #ff7bac;/*文字の色*/
        background-color: rgba(255,255,255,0);
        padding: 0;
        margin: 0;
    }
    .botton input#request {
        background: #61C359;/*背景色*/
    }
    /*top_btn_area*/
    #top_btn_area {
        display: block;
        padding: 2em 0 0 0;
    }
    #top_btn_area li {
        width: 100%;
        padding: 0 10% 0.75em 10%;
    }
    #top_btn_area li img {
        max-width: 100%;
    }
    /* YouTube */
    .movie-aria {
        padding: 1em 5% 3em 5%;
    }
    .movie-youtube {
        position: relative;
        width: 100%;
        /* 横幅は100%にしておく(ここを変えたい場合は実装コード2の方法を確認してください) */
        height: 0;
        /* 高さは0にしておく(padding-topで高さを指定するため) */
        padding-top: 56.25%;
        /* 高さを指定(16:9) */
    }
    /* YouTube埋め込み用のiframe */
    .movie-youtube iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

#page-guide-area .guide {
    background-color: #fff;
}
/* ページ内移動でメニューの重なりを修正 */
a.anchor#movie {
    margin: -120px 0 0 0;
    padding: 120px 0 0 0;
}
@media screen  and (max-width: 767px) {
    a.anchor#movie {
    margin: -105px 0 0 0;
    padding: 105px 0 0 0;
}
}