.fv { overflow: hidden; padding-top: 49%; position: relative; }
.fv::before { background: #000; opacity: 0.2; top: 0; left: 0; width: 100%; height: 100%; z-index: 3; }
.fv .vid { width: 101%; height: auto; overflow: hidden; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 0; z-index: 2; }
.fv .vid video { width: 100%; height: auto; }

.fv_text { z-index: 3; top: 0; bottom: 0; right: 0; left: 0; width: 100%; color: #fff; }
.fv_text h2 { width: 100%; font-size: 4.375rem; padding-bottom: 2rem; }
.fv_text .txt { font-size: 1.15rem; width: 100%; }
.fv_text .btn_wrap { padding-top: 5rem; }
.fv_text .btn_wrap .btn { margin: 0 0.5rem; }

.recommend { width: 100%; padding: 4rem 0; overflow: hidden; position: relative; }
.recommend h3 { padding-bottom: 2rem; }
.recommend h3 .icon { width: 3rem; }
.recommend h3 span { font-size: 2.5rem; display: block; padding-top: 0.5rem; width: 100%; }
.recommend .slider { width: 100%; position: relative; padding: 2rem 0; }
.recommend .slider .slide { width: 340px !important; margin: 0 1rem; }
.recommend .slider .wrap { width: 100%; }

.bg-color1 { background-color: #EDEBE2; }
.bg-color2 { background-color: #E8E5D9; }

.seminar_row { padding: 5rem 0 2rem; overflow: hidden; border-top: 1px solid #AAAAAA; }
.seminar_row .head_style2 { padding: 0.5rem 0; }
.seminar_row .btn_wrap { position: absolute; top: 0; right: 0; }
.seminar_row:first-child { border-top: none; }
.seminar_row .inner { position: relative; z-index: 2; }
.seminar_row .slider { padding: 3rem 0; }
.seminar_row .slider .slide { width: 285px; }
.seminars::after { opacity: 0.8; z-index: 1; content: ''; display: block; width: 100%; height: 100%; top: 0; left: 0; position: absolute; background: url(../img/common/bg-seminar.png) no-repeat center center; background-size: cover; }

.green_bg { padding: 4rem 0; background-image: url(../img/seminar/bg1.jpg); }
.green_bg .col { width: 48%; overflow: hidden; border-radius: 0.5rem; }
.green_bg .col .ttl { padding: 0.75rem 1.5rem; }
.green_bg .col .ttl h4 { font-size: 1.75rem; }
.green_bg .col .ttl h4 .icon { width: 2.75rem; margin-right: 0.5rem; }
.green_bg .col .ttl a { color: #fff; }
.green_bg .col .ttl .btn_wrap .btn.style3 .arw::after { width: 20px; height: 20px; background-image: url(../img/common/arw-white.png); background-size: 100% auto; }
.green_bg .col ul { padding: 0.5rem 2.5rem; }
.green_bg .col ul li { border-top: 1px solid #ccc; }
.green_bg .col ul li a { padding: 1.5rem 0; }
.green_bg .col ul li a::after { width: 25px; height: 25px; right: 0; top: 0; bottom: 0; margin: auto;
    background: url(../img/common/icn-arw2.png) no-repeat center center;
    background-size: 100% auto;
}
.green_bg .col ul li:first-child { border: none; }
.green_bg .col ul li .pic { width: 80px;  }
.green_bg .col ul li .info { width: calc(100% - 120px); box-sizing: border-box; padding-left: 2rem; }
.green_bg .col ul li .info .name { font-size: 1.25rem; padding: 1rem 0 0.25rem; }
.green_bg .col ul li .info .position { color: #888888; }
.green_bg .col ul li .info .title {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media screen and (max-width: 1100px) {
    .green_bg .col { width: 49%; }
    .green_bg .col .ttl { padding: 0.5rem 0.75rem; }
    .green_bg .col .ttl h4 { font-size: 1.25rem; }
    .green_bg .col .ttl h4 .icon { font-size: 2rem; }
    .green_bg .col .ttl a { font-size: 14px; }
    
    .green_bg .col ul { padding: 0.5rem 1rem; }
    .green_bg .col ul li a { padding: 0.75rem 0; }
    .green_bg .col ul li .pic { width: 70px; }
    .green_bg .col ul li .info { padding-left: 1rem; }
    .green_bg .col ul li .info .name { padding-top: 0.5rem; }
}

/* -------------------------------------------- sp */

@media screen and (max-width: 767px) {

    .bg-color2 { background-color: #D4CFBA; }

    .fv { padding: 0 3%; }
    .fv .vid { width: auto; height: 101%; }
    .fv .vid video { width: auto; height: 100%; }
    .fv_text { position: relative; width: 88%; margin: auto; padding: 4rem 0; } 
    .fv_text h2 { font-size: 3rem; line-height: 140%; padding-bottom: 1rem; }
    .fv_text .txt { font-size: 12px; }
    .fv_text .btn_wrap { padding-top: 2rem; }
    .fv_text .btn_wrap a.btn { margin-top: 0.5rem; height: 38px; line-height: 38px; min-width: 240px; }
    .fv_text .btn_wrap a.btn:first-child { margin: 0; }

    .recommend h3 { padding-bottom: 0; }
    .recommend h3 .icon { width: 24px; }
    .recommend h3 span { font-size: 2rem; line-height: 132%; }
    .recommend .slider .slide { width: 240px !important; }

    .seminar_row { padding: 3rem 0; overflow: hidden; }
    .seminar_row .slider { padding: 1rem 0; overflow: visible; }
    .seminar_row .slider .slide { width: 150px; }
    .seminar_row .btn_wrap { position: relative; width: 100%; text-align: center; }
    .seminar_row .slider .card1 .ttl { font-size: 12px; padding-bottom: 0.125rem; }
    .seminar_row .slider .card1 p.cat span { font-size: 9px; height: 16px; line-height: 16px; }
    .seminar_row .slider .card1 .row { padding: 0.25rem 0.75rem; }
    .seminar_row .slider .card1 .row p { font-size: 11px; }
    .seminar_row .slider .card1 .row p .icon { width: 14px; }
    .seminar_row .slider_dots { text-align: center; padding: 0; width: auto; top: 0; }
    .seminar_row .slider_nav { padding: 2rem 0; }

    .green_bg { padding: 3rem 0; }
    .green_bg .col { width: 100%; margin-top: 2rem; }
    .green_bg .col:first-child { margin-top: 0; }
    .green_bg .col ul li .pic { width: 72px; }
    .green_bg .col .ttl h4 { font-size: 1.5rem; }
    .green_bg .col .ttl a { font-size: 12px; }
    .green_bg .col .ttl h4 .icon { width: 2.5rem; }
    .green_bg .col ul li .info .name { padding: 0.25rem 0 0.5rem; line-height: 100%; }
    .green_bg .col ul li .info .position { font-size: 11px; line-height: 128%; }
    .green_bg .col ul li a::after { width: 22px; height: 22px; }
    .green_bg .col ul li .info .title { font-size: 12px; }
    
    .back_top { padding: 4rem 0; }
}