@charset "UTF-8";
h2.title{background:url("../img/common/title-icon/i008.png") left center no-repeat; background-size:contain;}

@media only screen and (min-width:440px) {
h2.title{margin-bottom: 40px; background-size:80px auto;}
}

#introduction #p-box{display:block;  position:relative; margin:0 auto; }
#introduction .photo{ position:absolute; top:0px; left:0px; list-style:none;}
#introduction .photo_00{ position:absolute; top:0px; left:0px; list-style:none;}
#introduction .photo img{ visibility:hidden; z-index:100;}
#introduction #ip_00 img{ visibility:visible; z-index:10;}
#introduction #i-navi{margin:0 auto; margin-top:20px; padding-top:180px; text-align:center;}
#introduction #i-navi li{display:inline-block; width:48%; margin:0 1% 5px 0; box-sizing:border-box;}
#introduction #i-navi li a{display:block;}

@media only screen and (min-width:320px) {
#introduction #i-navi{padding-top:220px;}
}


@media only screen and (min-width:380px) {
#introduction #i-navi{padding-top:240px;}
}

@media only screen and (min-width:420px) {
#introduction #i-navi{padding-top:280px;}
}


@media only screen and (min-width:470px) {
#introduction #p-box{display:block; width:452px; height:300px; position:relative; margin:0 auto; }
#introduction #i-navi{margin:0 auto; padding-top:0; text-align:center;}
#introduction #i-navi li{width:24%;}
}

@media only screen and (min-width:360px) {
}

@media only screen and (min-width:640px) {
}


.modal_wrap input{
    display: none;
}

.modal_overlay{
    display: flex;
    justify-content: center;
    overflow: auto;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    opacity: 0;
    transition: opacity 0.5s, transform 0s 0.5s;
    transform: scale(0);
}

.modal_trigger{
    position: absolute;
    width: 100%;
    height: 100%;
}

.modal_content{
    position: relative;
    align-self: center;
    width: 90%;
    max-width: 480px;
    padding: 35px 8px 15px 8px;
    box-sizing: border-box;
    background: #fff;
    line-height: 1.4em;
    transition: 0.5s;
}

.close_button{
    position: absolute;
    top: 14px;
    right: 3px;
    font-size: 24px;
    cursor: pointer;
}

.modal_wrap input:checked ~ .modal_overlay{
    opacity: 1;
    transform: scale(1);
    transition: opacity 0.5s;
}

