@charset "UTF-8";
/**====================================
 * CSS information
 * file name	: sp.css
====================================**/

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

    /* body
	-------------------------------------------------- */
    html {
        font-size: 62.5%;
    }
    body {
        font-size: 1.4em;
        min-width: inherit;
    }

    /* Responsive
	-------------------------------------------------- */
    .pc {
        display: none;
    }
    .sp {
        display: inline;
    }


    /*/////////////////////////////////////////////////////////////////////////////


              // loading //


    /////////////////////////////////////////////////////////////////////////////*/
    .loader-logo {
        width: 166px;
        height: 166px;
    }

    /*/////////////////////////////////////////////////////////////////////////////


              // layout //


    /////////////////////////////////////////////////////////////////////////////*/

    /* container
	-------------------------------------------------- */
    #container {
        padding-top: 64px;
    }

    /*/////////////////////////////////////////////////////////////////////////////


              // header //


	/////////////////////////////////////////////////////////////////////////////*/

    /* header
	-------------------------------------------------- */
    .header {
        height: 64px;
    }
    .header-logo {
        width: 104px;
        position: absolute;
        left: 4%;
        top: 18px;
    }

    /* follow-cta-list
    -------------------------------------------------- */
    .follow-cta-list {
        justify-content: space-between;
        width: 100%;
        height: 65px;
        position: fixed;
        top: auto;
        bottom: 0;
        right: 0;
        background: #ffffff;
        box-sizing: border-box;
        padding: 0 4%;
        opacity: 0;
    }
    .on .follow-cta-list {
        opacity: 1;
    }
    .follow-cta-list li {
        width: 49%;
        margin: 0;
    }
    /* cta-btn
    -------------------------------------------------- */
    .cta-btn .cta-link {
        width: 100%;
        height: 48px;
        line-height: 1.4;
        padding: 6px 20px 6px 25px;
        background-position: left 14px center;
    }
    .cta-btn .cta-link::after {
        right: 10px;
    }
    .cta-btn .cta-link .small {
        font-size: 1.0rem;
    }

    /* -- ._nonicon -- */
    .cta-btn._nonicon {
        width: 240px;
        margin: auto;
    }
    .cta-btn._nonicon .cta-link {
        height: 56px;
        line-height: 1.5;
        padding: 6px 10px 0;
    }

    /* -- ._full -- */
    .cta-btn._full {
        margin-bottom: 5px;
    }
    .cta-btn._full .cta-link {
        height: 56px;
        line-height: 1.5;
        background-position: left 22px center;
    }

    /* cta-txt
    -------------------------------------------------- */
    .cta-txt {
        font-size: 1.2rem;
        margin-bottom: 6px;
    }


    /* language-btn
    -------------------------------------------------- */
    .language-btn {
        padding: 8px 0;
        right: 64px;
    }

    /* language__box
    -------------------------------------------------- */
    .language__box {
        width: 92%;
        right: 4%;
        top: 64px;
        padding-top: 0;
        display: flex;
        justify-content: center;
        border-right: 1px solid #DEDEDE;
    }
    .language__item {
        width: 33.3333%;
        border-right: none;
    }
    .language__link {
        font-size: 1.2rem;
        padding: 11px 10px;
    }

    /* menu-trigger
    -------------------------------------------------- */
    .menu-trigger {
        right: 8px;
        top: 8px;
    }

    /* fixed-gnav
    -------------------------------------------------- */
    .fixed-gnav {
        width: 100%;
        height: calc(100vh - 64px);
        top: 64px;
    }
    .fixed-gnav-inner {
        padding: 25px 4% 80px;
        transition: .2s;
    }
    .ddhovered .fixed-gnav-inner {
        padding-top: 50px;
    }
    .fixed-gnav-list {
        padding-bottom: 20px;
    }
    .fixed-gnav-list li {
        font-size: 1.4rem;
    }

    /* layer
    -------------------------------------------------- */
    .layer {
        display: none;
    }

    /*/////////////////////////////////////////////////////////////////////////////


              // footer //


	/////////////////////////////////////////////////////////////////////////////*/
    .footer {
        padding: 0 0 100px;
        position: relative;
        background: #ffffff;
    }

    /* footer-map
    -------------------------------------------------- */
    .footer-map {
        height: 213px;
    }
    .footer-map::after {
        display: none;
    }

    /* footer-info
    -------------------------------------------------- */
    .footer-info {
        text-align: left;
        margin-top: 0;
        padding: 25px 0;
        position: relative;
    }
    .footer-logo {
        display: none;
    }
    .footer-info dl dt {
        font-size: 1.3rem;
        margin-bottom: 4px;
    }

    /* footer-nav
    -------------------------------------------------- */
    .footer-nav {
        display: none;
    }

    /* footer-btm
    -------------------------------------------------- */
    .footer-btm {
        display: block;
    }

    /* footer-subnav
    -------------------------------------------------- */
    .footer-subnav {
        display: block;
    }
    .footer-subnav li {
        margin: 0 0 10px;
    }
    /* copyright
    -------------------------------------------------- */
    .copyright {
        padding-top: 25px;
    }

    /* pagetop
    -------------------------------------------------- */
    .pagetop {
        position: absolute;
        bottom: 95px;
        right: 10px;
    }

    /*/////////////////////////////////////////////////////////////////////////////


              // common parts //


	/////////////////////////////////////////////////////////////////////////////*/

    /* ==================================================
        wave
	================================================== */
    .wave-item {
        width: 748px;
    }

	/* ==================================================
        pagettl
	================================================== */
	.pagettl {
	    padding: 5px 2.13333% 55px;
	    margin-bottom: 10px;
	}
	.pagettl-inner {
        padding: 0 3.3519%;
	}
	.pagettl .ttl {
        min-height: 60px;
	    font-size: 2.0rem;
	    padding: 20px 0 0;
        display: flex;
        justify-content: center;
        align-items: center;
	}

	/* breadcrumb
	-------------------------------------------------- */
    .breadcrumb li {
        font-size: 0.9rem;
    }

    /* ==================================================
        pagelead
	================================================== */
	.pagelead {
	    margin-bottom: 32px;
	}
	.pagelead-txt {
	    text-align: left;
	}
    .pagelead-box {
        padding: 18px 22px 22px;
        margin: 30px 0 25px;
    }
    .pagelead-box-ttl {
        display: block;
        position: absolute;
        top: -20px;
    }
    .pagelead-box-ttl p {
        font-size: 1.6rem;
        padding: 0 5px 0 10px;
    }
    .pagelead-box-ttl .picktxt {
        font-size: 2.1rem;
    }
    .pagelead-box-ttl .picktxt::after {
        width: 20px;
        height: 8px;
        top: 0;
    }
    .ribbon-txt-wrap {
        padding: 10px 0 32px;
    }
    .ribbon-txt-wrap::before,
    .ribbon-txt-wrap::after {
        width: 37px;
        height: 47px;
    }
    .ribbon-txt-wrap::before {
        left: -95px;
        top: 5px;
    }
    .ribbon-txt-wrap::after {
        right: -95px;
    }
    .pagelead-box .ribbon-txt {
        transform: scale(1.5);
    }
    .pagelead-box .txt {
        margin-bottom: 0;
    }
    .pagelead-box-heading {
        font-size: 1.8rem;
        margin-bottom: 15px;
    }

	/* anchorlink
	-------------------------------------------------- */
    .anchorlink {
        display: block;
        margin: 25px 0 0;
    }
    .anchorlink li {
        width: 100%;
        text-align: left;
        margin: 8px 0 0;
    }
    .anchorlink li a {
        width: 100%;
        padding: 14px 35px 14px 14px;
        font-size: 1.2rem;
    }
    .anchorlink li a::after {
        left: inherit;
        right: 14px;
        top: 50%;
        transform: translateY(-50%);
    }

    /* ==================================================
        section
	================================================== */
	.section {
        margin-bottom: 40px;
    }
    .section:last-child {
        margin-bottom: 50px;
    }
    .section._spnon-mb {
        margin-bottom: 0;
    }
    .section-narrow {
        margin-bottom: 20px;
    }
    .section-narrow:last-child {
        margin-bottom: 30px;
    }
    .section-inner {
        padding-left: 4%;
        padding-right: 4%;
    }
    .section-box .section-inner {
        padding-left: 0;
        padding-right: 0;
    }
    .section-box {
        padding: 30px 4% 50px;
        border-radius: 32px 32px 0 0;
    }

	/* sec-ttl
	-------------------------------------------------- */
    .sec-ttl {
        padding: 17px 0 18px;
        margin-bottom: 15px;
    }
    .sec-ttl .ttl {
        font-size: 1.8rem;
        padding: 0 10px;
    }

    /* sec-subttl
	-------------------------------------------------- */
    .sec-subttl {
        font-size: 1.4rem;
        padding: 10px 14px;
        margin: 20px 0 15px;
    }

    /* sec-box
	-------------------------------------------------- */
    .sec-box {
        padding: 20px 15px;
        margin: 20px 0 0;
    }
    .box-ttl {
        text-align: center;
        margin: 0 0 25px;
    }
    .box-ttl .ttl {
        font-size: 1.8rem;
        padding-bottom: 8px;
        margin-bottom: 8px;
    }

    /* section-block
	-------------------------------------------------- */
    .section-block p {
        margin-bottom: 10px;
    }

    /* list-note
	-------------------------------------------------- */
    .list-note {
        font-size: 1.1rem;
    }

    /* list-disc
    -------------------------------------------------- */
    .list-disc > li {
        font-size: 1.1rem;
    }
    .list-disc > li::before {
        top: 0.7em;
    }


    /* ==================================================
        btn
	================================================== */

    /* btn
	-------------------------------------------------- */
    .btn {
        margin-top: 30px;
    }
    .btn a {
        max-width: 310px;
        width: 90%;
        height: 56px;
    }
    .btn a::before {
        right: 14px;
    }

    /* arrow
	-------------------------------------------------- */
    .arrow-lbu {
        font-size: 1.2rem;
    }

    /*/////////////////////////////////////////////////////////////////////////////


              // Slider //


	/////////////////////////////////////////////////////////////////////////////*/
    .slick-dots li {
        margin: 0 1px !important;
    }
}