@charset "utf-8";

/* ======================================================

    lp

====================================================== */

.serif{
    font-family: "游明朝", YuMincho, 'Noto Serif Japanese' , "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

img {
    border: none;
    vertical-align: text-bottom;
    -ms-interpolation-mode: bicubic;
    max-width: 100%;
}

a:hover img {
    opacity: 0.8;
}

.spOnly{
    display: none;
}

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

    .pcOnly{
        display: none;
    }

    .spOnly{
        display: block;
    }

}

.container{
    box-sizing: border-box;
}

/* =======================
 ◇ ヘッダー
======================== */

.cf:after {
    content: "";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden
}

.header {
    width: 100%;
    position: relative;
    overflow: hidden;
    background: #ffffff;
    background: -moz-linear-gradient(top, #fff 1%, #fff 54%, transparent);
    background: -webkit-linear-gradient(top, #fff 1%, #fff 54%, transparent);
    background: linear-gradient(to bottom, #fff 1%, #fff 54%, transparent);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 );
    z-index: 100000;
    padding-bottom: 80px;
    transition: 0.5s;
    height: 85px;
    padding: 0;
}

.header .inner {
    position: relative;
    overflow: visible;
    max-width: 1200px;
    width: 96%;
    height: 100%;
    margin: 0 auto;
}

.header .inner .logo {
    float: left;
    width: 25%
}

.header .inner .tel_area {
    position: absolute;
    top: 10px;
    left: 29%;
    width: 46%
}

.header .inner .tel_area .img1 {
    width: 58%;
    display: block;
}


.header .inner .link-area {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(0);
    -ms-transform: translateY(-50%) translateX(0);
    -moz-transform: translateY(-50%) translateX(0);
    -o-transform: translateY(-50%) translateX(0);
    transform: translateY(-50%) translateX(0);
    left: 66%;
    width: 10%
}

.header .inner .link-area .img3 {
    margin-bottom: 2%
}

.header .inner .contact_area {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(0);
    -ms-transform: translateY(-50%) translateX(0);
    -moz-transform: translateY(-50%) translateX(0);
    -o-transform: translateY(-50%) translateX(0);
    transform: translateY(-50%) translateX(0);
    right: 0;
    width: 22%
}

.header-fix {
    position: fixed;
    top: 0;
    left: 0;
    background: #ffffff;
    filter: none;
    padding-bottom: 0;
    border-bottom: 1px solid #ccc
}

.header-fix .inner .tel_area {
    left: 22%;
    width: 42%
}

.header-fix .inner .tel_area .img1 {
    float: left;
    width: 33%
}

.header-fix .inner .tel_area .img2 {
    float: right;
    width: 67%
}

/*
@media screen and (max-width: 980px) {
    .header {
        padding-bottom:50px
    }

    .header .inner .tel_area {
        left: 25%;
        width: 38%
    }

    .header .inner .link-area {
        left: auto;
        right: 23%;
        width: 12%
    }

    .header .inner .link-area .img3 {
        margin-bottom: 0
    }

    .header-fix {
        padding-bottom: 0
    }
}
*/

@media screen and (max-width: 640px){
    .header {
        padding-bottom:2%
    }

    .header .inner .logo {
        width: 36%;
        margin: 10px 0
    }

    .header .inner .header-layout-box {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: -moz-flex;
        display: flex;
        -webkit-box-lines: multiple;
        -moz-box-lines: multiple;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -o-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 52%;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%) translateX(0);
        -ms-transform: translateY(-50%) translateX(0);
        -moz-transform: translateY(-50%) translateX(0);
        -o-transform: translateY(-50%) translateX(0);
        transform: translateY(-50%) translateX(0);
        right: 0
    }

    .header .inner .header-layout-box .link-area-sp {
        width: 48%;
        margin-right: 2%
    }

    .header .inner .header-layout-box .link-area-sp .img3 {
        margin-bottom: 2%
    }

    .header .inner .header-layout-box .contact_area-sp {
        width: 50%;
        background: #D01E36;
        border-radius: 4px;
        position: relative
    }

    .header .inner .header-layout-box .contact_area-sp a {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%) translateX(0);
        -ms-transform: translateY(-50%) translateX(0);
        -moz-transform: translateY(-50%) translateX(0);
        -o-transform: translateY(-50%) translateX(0);
        transform: translateY(-50%) translateX(0);
        left: 0;
        width: 100%;
        display: block
    }

    .header-fix {
        padding-bottom: 0
    }


    .header .inner{
        margin: 0;
        width: 100%;
        height: 10vw;
        overflow: visible;
    }
    .header .inner .logo{
        width: calc(96% - 190px);
        margin: 0 2%

    }

    .header .inner .logo img{
        width: 100%;
        max-width: 240px;
    }
    .header .inner .header-layout-box{
        display: none;
    }
    .header-spBox{
        float: right;
        width: 170px;
        height: 80px;
        display:-webkit-box!important;
        display:-moz-box!important;
        display:-ms-flexbox!important;
        display:-webkit-flex!important;
        display:-moz-flex!important;
        display:flex!important;
        -webkit-box-lines:multiple;
        -moz-box-lines:multiple;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -o-flex-wrap: wrap;
        flex-wrap: wrap;


    }
    .header-spBox-item{
        width: 50%;
        height: 80px;
    }
    .header-spBox-item-conpany .link{
        display: block;
        background: #3e1173;
        color: #fff;
        height:80px;
        text-align: center;
    }
    .header-spBox-item-contact .link{
        background: #d01e36;
        color: #fff;
        display: block;
        height: 80px;
        text-align: center;
    }
    .header-spBox-item .link img{
        width: 72px;
        height: 72px;
        height: auto;
        margin-top: 5px;
        max-width: 72px;
        max-height: 72px;
    }
}

/* =======================
 ◇ サイド
======================== */

.side{
    position: fixed;
    left: 20px;
    top:155px;
    z-index:200;
}

.side .linkarea li img{
    width:120px;
}
.side .linkarea li{
    margin-bottom: 9px;
}

/* =======================
 ◇ メイン
======================== */


/* =======================
 ◇ 共通
======================== */

.contents{
}


.contents .container{
    width:1000px;
    margin:auto;
}


    .contents .heading1 {
        background:url(../../images/common/title-h4.jpg) 0% 50% repeat;
        font-size: 185%;
        color: #fff;
        padding: 22px 30px;
        border-left: 5px solid #c79d3b;
        font-weight: normal;
        letter-spacing: 0.05em;
        margin-bottom: 30px;
    }
    .contents .heading1 span {
        font-size: 60%;
        display: block;
        letter-spacing: 0;
        margin-top: 5px;
    }	


    .contents .heading2{
        background:url(../../images/common/title-h5.png) 0 23% no-repeat;
        font-size: 125%;
        padding: 0 35px 18px;
        border-bottom: 2px solid #14694b;
        margin-bottom: 25px;
    }
    .contents .imagetitle{
        margin-bottom: 25px;
    }

    .contents .title_black{
        font-size: 2.4rem;
        letter-spacing: 0.1em;
        margin-bottom: 40px;
        padding: 60px 30px;
        color: #fff;
        line-height: 1.7;
        background: #000 url("../../../lp/eiju/images/price_title.png") 50% 50% no-repeat;
        background-size: cover;
    }

    .contents .title._green{
        font-size: 2.4rem;
        margin-bottom: 40px;
        padding: 24px 30px;
        color: #fff;
        line-height: 1.3;
        text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.4);
        background: #1E9F8A 100% 0 no-repeat;
        background-size: auto 100% ;
    }

    .contents > section{
        margin-bottom:80px;
    }

    .contents .accent{
        margin-bottom:25px;
    }

    .contents .visual{
        margin-bottom:25px;
    }
    .contents  p,
    .contents  dl,
    .contents  ul{
        font-size:125%;
    }

    .contents dl p,
    .contents ul p,
    .contents ul ul,
    .contents dl dl,
    .contents dl ul,
    .contents ul dl{
        font-size:100%;
    }

    .contets .text.txt-center{
        text-align:center;
    }

    .contents a.btn{
        display:inline-block;
        margin-top:10px;
        padding:10px 70px;
        color:#12a791;
        font-size:115%;
        font-weight:bold;
        text-decoration:none;
        border:2px solid #12a791;
        border-radius:12px;
    }
    .contents a.btn:before{
        content:"";
        position:relative;
        display:inline-block;
        top:4px;
        padding-right:0.5em;
        width:1.2em;
        height:1.2em;
        background:url(../../images/lp/takamatsu/bridaltrees/arrow.png) no-repeat;
        background-size:contain;
    }





.redarea{
    background: #f01;
    border-radius: 50px;
    padding: 15px;
    margin-bottom: 30px;
}

.redarea p{
    margin-bottom: 0;
    color: #fff;
    font-size: 207%;
    text-align: center;
    font-weight: 700;
}

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

    .contents .title_black{
        font-size: 1.8rem;
        margin-bottom: 40px;
        padding: 20px;
        text-align: center;
    }

    .contents .title._green{
        font-size: 1.4rem;
        padding: 16px 20px;
        line-height: 1.5;
    }
}

/* =======================
 ◇ #firstBox
======================== */

#firstBox .firstAppeal{
    margin-bottom: 40px;
}
#firstBox .firstAppeal h2{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 96%;
    margin: 0 auto;
}
#firstBox .firstAppeal h2 > *{
    width: 49%;
}


#firstBox .visual .logo{
    text-align: center;
    background: url("../../../lp/eiju/images/logo-decoration.png") 50% 50% no-repeat;
    background-size: 100% auto;
    margin-bottom: 20px;
}
#firstBox .visual .logo img{
    width: 50%;
}

#firstBox .visual h3{
    margin-top: 60px;
    text-align: center;
    margin-bottom: 30px;
}
#firstBox .visual h3 span{
    display: inline-block;
    font-size: 3.2rem;
    color: #C78F0E;
    text-align: center;
    background: url("../../../lp/eiju/images/appeal_decoration.png") 0 50% no-repeat , url("../../../lp/eiju/images/appeal_decoration.png") 100% 50% no-repeat;
    line-height: 1.4;
    padding-left: 60px;
    padding-right: 60px;
}


#firstBox .visual .point{
    display: flex;
    justify-content: space-between;
}

#firstBox .visual .point li{
    width: 48%;
}

#firstBox .shop h3{
    font-size: 2.4rem;
    color: #C78F0E;
    text-align: center;
    background: url("../../../lp/eiju/images/appeal_decoration.png") 0 50% no-repeat , url("../../../lp/eiju/images/appeal_decoration.png") 100% 50% no-repeat;
    line-height: 1.4;
    margin-bottom: 44px;
}
#firstBox .shop .shopList{
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    margin-bottom: 44px;
}
#firstBox .shop .shopList li{
    width: 32%;
}
#firstBox .shop .shopList li:last-child{
    width: 32.4%;
}
#firstBox .shop .shopList li a{
    display: block;
    border: 1px solid  #000;
    padding: 8px;
}

#firstBox .shop .map iframe{
    height: 500px;
    margin-bottom: 44px;
}

#firstBox .shop .banner + .banner{
    margin-top: 40px;
}


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

    #firstBox .firstAppeal{
        margin-bottom: 36px;
    }
    #firstBox .firstAppeal h2{
        display: block;
    }
    #firstBox .firstAppeal h2 > span{
        display: block;
        width: auto;
    }
    #firstBox .firstAppeal h2 > span + span{
        margin-top: 14px;
        padding-top: 14px;
        border-top:3px solid #3F1073;
    }


    #firstBox .visual .logo{
        text-align: center;
        background:none;
        margin-bottom: 20px;
    }
    #firstBox .visual .logo img{
        width: 80%;
    }


    #firstBox .visual h3 span{
        font-size: 1.6rem;
        background-size: 30px auto;
        padding-left: 35px;
        padding-right: 31px;
    }
    
    #firstBox .shop h3{
        font-size: 1.4rem;
        background-size: 30px auto;
        padding-left: 35px;
        padding-right: 31px;
        margin-bottom: 24px;
    }
    #firstBox .shop .shopList{
        display: block;
    }
    #firstBox .shop .shopList li{
        width: auto;
        margin-bottom: 16px;
    }
    #firstBox .shop .shopList li:last-child{
        width: auto;
        margin-bottom: 0;
    }
    #firstBox .shop .shopList li a{
        display: block;
        border: 1px solid  #000;
        padding: 20px;
    }
    #firstBox .shop .shopList li a img{
        width: 100%;
    }
}


/* =======================
 ◇ contact
======================== */
.contents .contact{
    margin-bottom:40px;
    text-align:center;
}

/* =======================
 ◇ mv
======================== */

#mv{
    background: url("../../images/lp/eiju/bg.jpg") repeat-y;
    padding-bottom: 80px;
}

ul.image li{
    margin-bottom: 40px;
}

.contents #mv ul.btnarea{
    width: 80%;
    margin: auto;
}

.contents #mv ul.btnarea li{
    width: 50%;
    float: left;
    text-align: center;
}

/* =======================
 ◇ info
======================== */

.contents #info{
    background: url("../../images/lp/eiju/bg.jpg") repeat-y;
    padding: 80px 0;
}

.contents #info .moviearea{
    margin: 0 0 3em 0;
    padding: 0 35px 45px 35px;
    border: 5px solid #c79d3b;
    background-color: #ffffff;
    text-align: center;
}

.contents #info .moviearea h3.movie{
    font-size: 250%;
    color: #fff;
    font-weight: bold;
    background: #c79d3b url("../../images/lp/eiju/movie-background.png") 0 50% no-repeat;
    padding: 4px 6px;
    margin-bottom: 45px;
    margin-left: -35px;
    margin-right: -35px;
    text-align: center;
}

.contents #info .moviearea .youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.contents #info .moviearea .youtube iframe {
  width: 100%;
  height: 100%;
}

.contents #info h4{
    background:url("../../images/lp/eiju/info_bg.jpg") no-repeat;
}

.contents #info ol.image-list li{
    margin-bottom: 0;
}

.contents #info ol.image-list li:first-child,
.contents #info ol.image-list li:nth-child(2){
    margin-bottom: 50px;
}

.contents #info ol.image-list li dl dt{
    background: #000;
    color: #fff;
    text-align: center;
    font-size: 117%;
    font-weight: 700;
    padding: 8px;

}

.contents #info ol.image-list li dl dd.image{
    position: relative;
    margin-bottom: 24px;
}

.contents #info ol.image-list li dl dd.image span{
    display: block;
    color: #fff;
    text-align: center;
    margin-top: -65px;
    margin-bottom: 40px;
}

.contents #info ol.image-list li dl dd.image span em{
    display: block;

    font-size: 124%;
}

.contents #info ol.image-list li dl dd.details a{
    background: #f01;
    padding: 8px;
    text-align: center;
    color: #fff;
    display: block;
    width: 40%;
    margin: auto;
    border-radius: 50px;
    text-decoration: none;
    position: relative;
}

.contents #info ol.image-list li dl dd.image iframe{
    overflow: hidden;
    box-sizing: border-box;
    border: 2px solid #d4d4d4;
}

.contents #info ol.image-list li dl dd.details a:hover{
    opacity: 0.7;
}

.contents #info ol.image-list li dl dd.details a span{
    position: relative;
}

.contents #info ol.image-list li dl dd.details a span:after{
    position: absolute;
    top: 50%;
    left: -25px;
    margin-top: -4px;
    display: block;
    width: 8px;
    height: 8px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    content: "";
}

/* =======================
 ◇ price
======================== */

.contents #price{
    background: url("../../images/lp/eiju/bg.jpg") repeat-y;
    padding: 80px 0;
}

.contents #price .title{
    margin-bottom: 24px;
}
.contents #price .planBox1 .title{
    background-image:url("../../../lp/eiju/images/plan_title1.png");
}
.contents #price .planBox2 .title{
    background-image:url("../../../lp/eiju/images/plan_title2.png");
}
.contents #price .planBox3 .title{
    background-image:url("../../../lp/eiju/images/plan_title3.png");
}
.contents #price .planBox4 .title{
    background-image:url("../../../lp/eiju/images/plan_title4.png");
}
.contents #price .planBox5 .title{
    background-image:url("../../../lp/eiju/images/plan_title5.png");
}

.contents #price section + section{
    margin-top: 64px;
}

.contents #price .planList{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 96%;
    gap: 24px 0;
    margin: 0 auto;
}
.contents #price .planList li{
    width: 48%;
}
.contents #price .planList li dl dt{
    margin-bottom: 8px;
}
.contents #price .planList li dl dd{
    font-weight: 700;
}
.contents #price .planWide{
    width: 96%;
    margin: 24px auto 0 auto;
}

#price .colorbox {
    background: #fff;
    border-radius: 10px;
    padding: 45px 30px;
    position: relative;
    width: 96%;
    margin: 24px auto 30px auto;
    box-sizing: border-box;
}
#price .colorbox:after {
    content: "";
    position: absolute;
    background:url("../../../lp/eiju/images/contact_detail.png") 0 0 no-repeat;
    background-size: contain;
    width: 130px;
    height: 128px;
    right: 20px;
    top: 18px;
}
#price .colorbox ol.circle li {
    list-style-type: square;
    line-height: 2;
    margin-left: 20px;
}

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

    .contents #price .planList{
        display: block;
    }
    .contents #price .planList li{
        width: auto;
        margin-bottom: 24px;
    }
    .contents #price .planList li:last-child{
        margin-bottom: 0;
    }
    .contents #price .planList li dl dd{
        font-size: 1rem;
    }

    .contents #price .planWide img.spOnly + img.spOnly{
        display: block;
        margin-top: 20px;
        padding-top: 20px;
        border-top: #A83B26 solid 3px;
    }

    #price .colorbox {
        padding: 30px 18px 40px;
    }
}


/* =======================
 ◇ otherNavi
======================== */

.otherNavi{
    padding: 60px 0;
}

.otherNavi ul.menulist{
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    width: 96%;
    margin: 0 auto;

}


.otherNavi ul.menulist li{
    width: 48%;
}

.otherNavi ul.menulist li a{
    display: block;
    padding: 40px;
    border-radius: 20px;
    color: #fff;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    font-size: 1.8rem;
    transition: .3s;
}
.otherNavi ul.menulist li a span{
    display: inline-block;
    background: url("../../../lp/eiju/images/arrow.png") 0 50% no-repeat;
    background-size: auto 80%;
    font-size: 1.6rem;
    padding-left: 24px;
}

.otherNavi ul.menulist li.merit a{
    background: #C68F0E;
}
.otherNavi ul.menulist li.merit a:hover{
    background: #A57413;
}


.otherNavi ul.menulist li.flow a{
    background: #171C61;
}
.otherNavi ul.menulist li.flow a:hover{
    background: #0B114C;
}

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

    .otherNavi ul.menulist{
        display: block;
        width: auto;
    }
    .otherNavi ul.menulist li{
        width: auto;
        margin-bottom: 20px;
    }
    .otherNavi ul.menulist li a{
        display: block;
        padding: 18px;
        font-size: 1.4rem;
    }
    .otherNavi ul.menulist li a span{
        font-size: 1rem;
    }
}


/* =======================
 ◇ estimate
======================== */
#estimate{
    margin-bottom: 50px;
}

#estimate .container{
    padding-left: 2%;
    padding-right: 2%;
}

#estimate p.leadtext{
    font-size: 1.4rem;
    font-weight: 700;
    padding: 16px 40px;
    background: #F4D924;
}
#estimate p.leadtext span{
    display: block;
    padding-left: 1em;
    text-indent: -1em;
}
#estimate p.leadtext em{
    color: #D71718;
}

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

    #estimate p.leadtext{
        font-size: 0.9rem;
        padding: 16px;
    }
}

/* =======================
 ◇ case
======================== */
#case{
    background: url("../../../lp/eiju/images/bg_gray.jpg") 50% 50% repeat;
    background-size: cover;
}


#case h3{
    margin-bottom: 34px;
}

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

    #case p.case img{
        display: block;
        margin-bottom: 16px;
    }
}

/* =======================
 ◇ contactArea
======================== */
.contactArea{
    margin-top: 34px;
    margin-bottom: 64px;
}

.contactArea .mailbox{
    padding: 16px 34px;
    background: #1E9F88;
    margin-bottom: 34px;
}

.contactArea .mailbox h4{
    margin-bottom: 8px;
}

.contactArea .mailbox ul.buttons{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 14px;
}
.contactArea .mailbox ul.buttons li{
    width: 48%;
}
.contactArea .mailbox p.uketsuke{
    margin-bottom: 0;
}

.contents .contactArea p.banner_name{
    margin-bottom: 0;
}

.contactArea ul.contactList{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 24px;
}
.contactArea ul.contactList li:first-child{
    width: 50%;
}
.contactArea ul.contactList li{
    width: 48%;
}

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

    .contactArea ul.contactList{
        display: block;
        margin-top: 24px;
    }
    .contactArea ul.contactList li{
        width: auto;
    }
    .contactArea ul.contactList li:first-child{
        width: auto;
        margin-bottom: 20px;
    }
}

/* =======================
 ◇ consultation
======================== */
.contents .consultation{
    overflow: hidden;
    padding:20px 0;
    border-bottom:4px solid #11a58d;
    margin-bottom:40px;
}

    .contents .consultation ul.list{
        margin: 0;
    }

    .contents .consultation ul.list li{
        float: left;
        position: relative;
        display: inline-block;
        margin-right:8px;
    }

    .contents .consultation ul.list li:last-child{
        margin-right:0;
    }


/* =======================
 ◇ commontxt
======================== */
.contents .container dl.commontxt{
    margin-bottom:35px;
}

    .contents .container dl.commontxt dt{
        color:#2E75B6;
        margin-bottom:25px;
        background:#fffae0;
        padding:20px;
        border-radius:10px;
    }

    .contents .container dl.commontxt dd{
    }


/* =======================
 ◇ correspondingArea
======================== */
.contents .container .correspondingArea{
    margin-bottom:35px;
    background:#fffae0;
    padding:20px;
    border-radius:10px;
}

    .contents .container .correspondingArea dl.text{
        color:#2E75B6;
    }

    .contents .container .correspondingArea dl.text dt{
        font-size:122%;
        font-weight:700;
        margin-bottom:8px;
    }

    .contents .container .correspondingArea dl.text dt span{
        color:#f01;
    }

    .contents .container .correspondingArea dl.text dd{
    }

    .contents .container .correspondingArea .cemetery{
        margin-bottom:35px;
        background:#dbfffc;
        padding:20px;
        border-radius:10px;
    }

/* =======================
 ◇ topまわり
======================== */
.contents h2{
    margin-bottom:20px;
}


/* =======================
 ◇ about
======================== */
#about p.text{
    line-height:1.8;
    margin-bottom:40px;
}

#about p.price{
    margin-bottom:30px;
}

/* =======================
 ◇ merit
======================== */

.contents .merittitle{
    background-image:url("../../../lp/eiju/images/title_merit.png")!important;
}

.merit ul.list li{
    display:table;
    width:100%;
    margin-bottom:35px;
}

.merit ul.list li > *{
    display:table-cell;
    vertical-align:top;
}

.merit ul.list li > p.image img{
    width:90%;
}

.merit ul.list li > dl.text{
    width:765px;
}

.merit ul.list li > dl.text dt{
    width:100%;
    display:table;
    box-sizing:border-box;
    background:#B9862D url(../../images/pet/merit-title.png) 0 0 no-repeat;
    background-size:100% auto;
    height:84px;
    padding-left:20px;
    font-size:190%;
    color:#fff;
    font-weight:700;
    margin-bottom:20px;
}

    .merit ul.list li > dl.text dt > em{
        display:table-cell;
        vertical-align:middle;
        font-style:italic;
    }

    .merit ul.list li > dl.text dt span{
        display: inline-block;
        width:1.5em;
        height:1.5em;
        line-height: 1.5em;
        border-radius:50%;
        text-align:center;
        vertical-align: middle;
        color:#bd8e32;
        background:#fff;
        margin-right:20px;
        font-style:normal;
    }

.merit ul.list li > dl.text dd{
    padding:0 10px;
}


/* =======================
 ◇ flier
======================== */
.flier{
    background: #F2F2F2;
    border: 1px solid#CCCCCC;
    padding: 50px 10px 0;
    margin: 80px 0;
}

.flier p.image{
    text-align: center;
    margin-bottom: 23px;
}
.flier p.image img{
    max-width: 100%;
}
.flier p.link{
    text-align: center;
}
.flier p.link a{
    text-decoration: none;
}
.flier p.link a:hover{
    text-decoration: underline;
}

/* --------------------------------
   □ step
-------------------------------- */

.contents .steptitle{
    background-image:url("../../../lp/eiju/images/title_step.png")!important;

}

#step .step{
    overflow:hidden;
    margin-left:-3.3%;
}
    #step .step dl{
        box-sizing:border-box;
        float:left;
        width:30%;
        margin:0 0 3% 3.3%;
        position:relative;

        background-color:#F8F3E8;
        border:2px solid #C79D39;
    }

    #step .step dl:after{
        content: ' ';
        height: 0;
        position: absolute;
        width: 0;
        border: 10px solid transparent;
        border-left-color: #FF0000;
        right: -11%;
        top: 50%;
    }

    #step .step dl.none:after{
        border: none;
    }

        #step .step dl:nth-child(3),
        #step .step dl:nth-child(6),
        #step .step dl:nth-child(9){
            margin-right:0;
        }

        #step .step dt{
            background-color:#C79D39;
            text-align:center;
            color:#fff;
            padding:5px;
            font-weight:bold;
            font-size:150%;
        }
        #step .step dd{
            text-align:center;
            padding-bottom:15px;
        }

        #step .step dd > img{
            width:100%;
        }

        #step .step dd p{
            text-align:left;
            margin:8px;
        }
        #step .step dd ul.contact{
            background-color:#FF0000;
            color:#fff;
            margin:10px 10px 0 10px;
            padding:8px;
            text-align:left;
            font-weight:bold;
            line-height:1em;
        }
        #step .step dd ul.contact li{
            margin-bottom:5px;
        }
        #step .step dd ul.contact li:first-child:before{
            content:url(../../images/lp/marugame/icon_tel.png)
        }
        #step .step dd ul.contact li:last-child:before{
            content:url(../../images/lp/marugame/icon_mail.png);
        }
        #step .step dd ul.contact li a{
            color:#fff;
            text-decoration:none;
            word-break: break-all;
        }
        #step .step dd span{
            text-align:center;
            background-color:#FF0000;
            color:#fff;
            padding:3px;
            font-weight: bold;
            display:block;
            width:80px;
            margin:0 0 5px 0;
            float:right;
        }


/* --------------------------------
   □ qa
-------------------------------- */
#qa {
    margin-bottom: 80px;
}


#qa .qatitle{
    background-image:url("../../../lp/eiju/images/title_qa.png");
}

#qa .hQ{
    border-bottom: 1px dotted #cccccc;
    padding: 10px 30px 10px 0;
}

#qa .hQ p{
    padding: 0px 0px 0 37px;
}

.hQ p span{
    color: #1d6e55;
    font-weight:700;
}

#qa .hQ p.q{
    font-size:148%;
    min-height:27px;
    background:url(../../../images/cleaning/q.png) 0 0 no-repeat;
}

#qa .hQ p.a{
    background: url(../../../images/cleaning/a.png) 0 0 no-repeat;
    padding-top: 5px;
}

#qa .hQ p.a span.red{
    display:block;
    color:#f01;
    font-weight:700;
}

/* --------------------------------
   □ facility
-------------------------------- */
#facility .image{
    margin-bottom:40px;
}

#facility ul.images{
    margin:0 0 4% 0;
}

#facility .facility-list{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
}
#facility .facility-list li{
    width:32%;
    margin-bottom:20px;
}

#facility .facility-list li.per50{
    width:49%;
}
#facility .facility-list li.per100{
    width:100%;
}


#facility .facility-list li dl img{
    width:100%;
}

#facility .facility-list li.per100 dl{
    width:100%;
}

#facility .facility-list li dt{
    margin-bottom:12px;
}

#facility .colorbox {
    background: #efe3c7;
    border-radius: 10px;
    padding: 30px;
    position: relative;
    margin-bottom: 30px;
}
#facility .colorbox:after {
    content: "";
    position: absolute;
    background: url(../../images/lp/takamatsu/chapel/contact_detail.png);
    width: 130px;
    height: 128px;
    right: 30px;
    top: 50%;
    margin-top: -64px;
}
#facility .colorbox ol.circle li {
    list-style-type: square;
    line-height: 2;
    margin-left: 20px;
}


/* --------------------------------
   □ service
-------------------------------- */

#service .division{
    margin-bottom:25px;
}

#service .division h5{
    margin-bottom:15px;
    text-decoration:underline;
    font-size:180%;
    text-align:center;
}

#service .division p.attention{
    font-size:95%;
}


/* --------------------------------
   □ shoptable
-------------------------------- */
table.shoptable{
    width:80%;
    font-size:127%;
    margin:0 auto;
}

table.shoptable tr{
    border-bottom: 1px solid #d4d4d4;
}

table.shoptable th,
table.shoptable td{
    padding: 15px;
}

table.shoptable th{
    vertical-align:top;
}

table.shoptable th span{
    background: #1a885e;
    color: #fff;
    border-radius: 5px;
    display: block;
    padding: 5px;
    text-align: center;
}

table.shoptable td p.mapimage{
    margin-top:15px;
}

/* --------------------------------
   □ relation
-------------------------------- */
.contents .chapter p{
    text-align:center;
    margin-bottom:40px;
}

/* --------------------------------
   □ pr
-------------------------------- */
#pr .container{

}
#pr .container dl{
    margin-bottom:50px;
}

#pr .container dl dt{
    margin-bottom:25px;
}

#pr .container dl dd{
    margin-bottom:15px;
}

#pr .container dl dd.text{
    margin-bottom:15px;
    padding:10px 20px;
    font-weight:bold;
    background:#fffae0;
    color:#2E75B6;
}

#footer-info .btn-aji{
    float:none;
    display: none;
}

#footer-info .btn-totop{
    display: block;
    text-align:right;
}

#footer-info .btn-chapel{
    display: block;
    text-align: right;
}

/* --------------------------------
   □ last
-------------------------------- */

#last .subsection{
    margin-bottom:30px;
}

#last .contact{
    margin-bottom:35px;
}

#last .division{
    margin-bottom:40px;
}

#last .division dl dt{
    border-left: 6px solid #1a885e;
    padding-left: 10px;
    margin-bottom: 25px;
}

#last .division dl dd ul.list{
    line-height: 2;
    margin-left: 15px;
}

#footer-info .btn-chapel {
    display: none;
}

#footer-info  {
    bottom:5px;
}

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

#footer-info .btn-totop {
    display: block;
}

/* =======================
 ◇ サイド
======================== */

.side{
    position: relative;
    right: inherit;
    top: inherit;
    padding: 0 3%;
    overflow: hidden;
}

.side .linkarea li {
    width: 48%;
    margin-right: 4%;
    float: left;
}
.side .linkarea li:nth-child(2n) {
    margin-right: 0;
}

    .side .linkarea li:last-child {
        margin-bottom: 0;
    }


/* =======================
 ◇ 共通
======================== */
.contents{
    padding-top: 20px;
}



.contents .container,
.contents .chapter{
    width:auto;
    padding:0 3%;
}

    .contents .heading1 {
        background-position:0% 50%;
        font-size: 130%;
        color: #fff;
        padding: 15px 20px;
        letter-spacing: 0;
        margin-bottom: 20px;
    }

    .contents .heading2{
        background-position:0% 23%;
        font-size: 130%;
        padding: 0 10px 8px 23px;
        margin-bottom: 17px;
    }

    .contents h4.title_black {
        padding: 8px 15px;
        font-size: 175%;
    }

    .contents .box > section{
        margin-bottom:8%;
    }

    .contents .accent{
        margin-bottom:3%;
    }

    .contents .visual{
        margin-bottom:3%;
    }
    .contents  p,
    .contents  dl,
    .contents  ul{
        font-size:100%;
    }

    .contents a.btn{
        padding:10px 20px;
    }


.redarea p{
    font-size: 137%;
}

.flier {
    padding-bottom: 0;
    margin: 10% 0;
}

.contents .chapter p {
    margin-bottom: 20px;
}

.image-list {
    display: block;
}
.image-list li {
    width: auto;
    margin-bottom: 20px;
}
.image-list li.per50 {
    width: auto;
}

/* =======================
 ◇ mv
======================== */

.contents #mv{
    padding-bottom: 10%;
}

.contents #mv ul.btnarea {
    width: auto;
    margin: auto;
}	

    .contents #mv ul.image li {
        margin-bottom: 20px;
    }

.contents #mv ul.btnarea li {
    width: 48%;
    margin-right: 4%;
}

    .contents #mv ul.btnarea li:last-child{
        margin-right: 0;
    }

    .redarea {
        padding: 8px;
    }

/* =======================
 ◇ info
======================== */

.contents #info {
    padding: 10% 0;
    margin-bottom: 0;
}

.contents #info .moviearea{
    margin: 0 0 3em 0;
    padding: 0 15px 15px 15px;
}

.contents #info .moviearea h3.movie{
    font-size: 150%;
    color: #fff;
    margin-bottom: 15px;
    margin-left: -15px;
    margin-right: -15px;
    text-align: center;
}

.contents #info .movie iframe{
    width: 100%;
}

.contents #info ol.image-list li{
margin-bottom:20px;
}

.contents #info ol.image-list li dl dd.details a {
    width: 80%;
}

.contents #info ol.image-list li dl dd.image iframe {
    height: 335px;
}

.contents #info ol.image-list li dl dd.image span{
    display: block;
    color: #fff;
    text-align: center;
    margin-top: -3.8em;
    margin-bottom: 0;
    background:rgba(0,0,0,0.5);
}

.contents #price {
    padding: 10% 0;
}

/* =======================
 ◇ merit
======================== */

#merit {
    padding-top: 10%;
}



/* =======================
 ◇ contact
======================== */
.contents .contact{
    margin-bottom:4%;
}

/* =======================
 ◇ consultation
======================== */
.contents .consultation {
    clear: both;
    padding: 3%;
    box-sizing: border-box;
}

.contents .consultation ul.list li {
    width: 30%;
    margin-bottom: 8px;
}

.contents .consultation ul.list li:nth-child(3n){
    margin-right:0;
}

.contents .consultation ul.list li:last-child {
    width:100%;
    display:block;
}


/* =======================
 ◇ about
======================== */
#about p.text{
    margin-bottom:4%;
}

#about p.price{
    margin-bottom:3%;
}

/* =======================
 ◇ merit
======================== */
.merit ul.list li{
    display:table;
    width:100%;
    margin-bottom:3%;
}

.merit ul.list li > *{
    display:table-cell;
    vertical-align:top;
}

.merit ul.list li > p.image img{
    width:90%;
}

.merit ul.list li > dl.text{
    width:80%;
}

.merit ul.list li > dl.text dt{
    height:3em;
    padding-left:5px;
    font-size:110%;
    color:#fff;
    font-weight:700;
    margin-bottom:2%;

    background:#B9862D;
}

    .merit ul.list li > dl.text dt span{
        margin-right:5px;
    }
/* --------------------------------
   □ price
-------------------------------- */

#price .colorbox:after {
    content: "";
    position: relative;
    background: url(../../images/lp/eiju/contact_detail_sp.png) 50% 50% no-repeat;
    width: 100%;
    height: 64px;
    right: initial;
    top: inherit;
    bottom: -15px;
    margin: 0 auto;
    display: block;
}

/* --------------------------------
   □ step
-------------------------------- */
#step .step{
    margin-left:-3%;
}
    #step .step dl{
        width:47%;
        margin:0 0 3% 3%;
    }

    #step .step dl:after{
        display:none;
    }


/* --------------------------------
   □ qa
-------------------------------- */
#qa {
    margin-bottom: 8%;
    font-size: 126%;
}

    #qa .hQ{
    border-bottom: 1px dotted #cccccc;
    padding: 2% 3%;
}


    #qa .hQ p.q{
        font-size:120%;
    }


/* --------------------------------
   □ facility
-------------------------------- */
#facility p.text{
    margin:0 3%;
    margin-bottom:4%;
}


#facility dl.image{
    margin:0 2%;
}

#facility dl.image dt{
    padding:1%;
    color:#fff;
    background:#26292E;
    font-size:148%;
    font-weight:700;
}

#facility dl.image dd img{
    width:100%;
}

#facility .colorbox:after {
    display: block;
    position: static;
    width: 130px;
    height: 128px;
    margin: 0 auto;
    margin-top: 20px;
}

/* --------------------------------
   □ pr
-------------------------------- */
#pr .container{

}
#pr .container dl{
    margin-bottom:50px;
}

#pr .container dl dt{
    margin-bottom:25px;
}

#pr .container dl dd{
    margin-bottom:15px;
}

#pr .container dl dd.text{
    margin-bottom:15px;
}

/* --------------------------------
   □ shoptable
-------------------------------- */
table.shoptable{
    width:100%;
    font-size:100%;
}


table.shoptable th,
table.shoptable td{
    padding: 2%;
}

table.shoptable td{
    padding: 2% 4%;
}
table.shoptable th span{
    padding: 5px;
    text-align: center;
    white-space:nowrap;
    width:5em;
}

table.shoptable td p.mapimage{
    margin-top:2%;
}

/* --------------------------------
   □ relation
-------------------------------- */
.contents .relation{
    margin-bottom:4%;
}

/* --------------------------------
   □ last
-------------------------------- */
#last .lastchild{
    margin-bottom: 0;
}


/* --------------------------------
   □ plan
-------------------------------- */

#plan .division{
    zoom:1;
    overflow:hidden;
    margin-bottom:20px;
}
#plan .division h5{
    margin-bottom:15px;
    font-size:120%;
    text-decoration:underline;
}

#plan .division p.image{
    float:none;
    margin-right:0px;
    text-align:center;
}

#plan .explain{
    float:none;
    width:auto;
}


#plan table{
    width:100%;
}

#plan table th,
#plan table td{
    padding:8px 4px;
    text-align:center;
}

#plan table th{
    color:#fff;
    background:#242736;
}
#plan table small{
    display:block;
}

#plan table td{
    background:#d9d9d9;
}
#plan table tr:nth-child(odd) td{
    background:#ededed;
}

#plan table th.sample{
    width:180px;
    box-sizing:border-box;
}

#footer-info .btn-chapel {
    bottom: 204px;
    right: -10px;
}


}

