@charset "utf-8";
/* CSS Document */

/* -----------------------------------------------
 [Global Normalize CSS]
-------------------------------------------------- */
/* /common/css/normalize.css */

/* -----------------------------------------------
 [Global Styles CSS]
-------------------------------------------------- */
/* reset
-------------------------------------------------- */
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font-size:100%;font:inherit;vertical-align:top;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:none}table{border-collapse:collapse;border-spacing:0}

/* .clearfix
-------------------------------------------------- */
.clearfix:after {
    content: "";
    clear: both;
    display: block;
}

/* -----------------------------------------------
 [CSS for JavaScript]
-------------------------------------------------- */
/* for JavaScript Name
-------------------------------------------------- */

/* -----------------------------------------------
 [Exclusive use CSS]
-------------------------------------------------- */
/* #body
-------------------------------------------------- */
body {
    background: url(/hanamizuki/wedding-img/common/bg_body.jpg) repeat left top;
    font-family:
        "ＭＳ Ｐゴシック", "MS P Gothic", "メイリオ", "Meiryo",
        "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Verdana, Arial,
        Helvetica, sans-serif;
    font-size: 12px;
    line-height: 1.6;
}
a {
    color: #000;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
.indent {
    letter-spacing: -0.1em;
}
/* #gnavi
-------------------------------------------------- */
#gnavi {
    width: 1000px;
    z-index: 600;
    height: 83px;
    position: relative;
    text-align: center;
    left: 50%;
    margin-left: -500px;
}
#gnavi ul {
    width: 1000px;
    margin: 0 auto;
    background: url(/hanamizuki/wedding-img/common/bg_navi.png) no-repeat center
        top;
    padding: 0;
    height: 83px;
}
#gnavi li {
    float: left;
    text-align: center;
    width: 200px;
}
#gnavi li a {
    padding: 31px 0;
    display: block;
}
#gnavi li.first,
#gnavi li.last {
    text-align: left;
}
#gnavi li.first a {
    padding-left: 40px;
    width: 160px;
}
#gnavi li.last a {
    padding-left: 40px;
    width: 160px;
}
#gnavi li .active {
    background: url(/hanamizuki/wedding-img/common/icon_navi_active.gif)
        no-repeat center 56px;
}

/* #pickup
-------------------------------------------------- */
#pickup {
    width: 890px;
    margin: 0 auto;
}
#pickup h3 {
    text-align: center;
    margin-bottom: 35px;
}
#pickup li {
    float: right;
}
#pickup li:first-child {
    float: left;
}
@media (width <= 1023px) {
    #pickup {
        width: auto;
    }
    #pickup h3 img {
        max-width: 100%;
        height: auto;
    }
    #pickup ul {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    #pickup li {
        float: none;
        margin-bottom: 20px;
    }
    #pickup li img {
        max-width: 100%;
        height: auto;
    }
    #pickup li:first-child {
        float: none;
    }
}
/* #contact
-------------------------------------------------- */
#contact {
    background: #ffffff;
    border-top: 1px solid #d1dcdc;
    padding: 30px 0 26px;
}
#contact h1 {
    text-align: center;
    margin-bottom: 35px;
    @media (width <= 1023px) {
        padding: 0 10px;
        img {
            max-width: 100%;
            height: auto;
        }
    }
}
#contact ul {
    width: 750px;
    margin: 0 auto;
    @media (width <= 1023px) {
        width: auto;
        padding: 0 10px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
}
#contact li {
    float: right;
    background: url(/hanamizuki/wedding-img/common/bnr_contact_mail.gif)
        no-repeat left -104px;
    @media (width <= 1023px) {
        float: none;
        margin-bottom: 20px;
    }
}
#contact li:first-child {
    float: left;
    @media (width <= 1023px) {
        float: none;
    }
}
#contact li img {
    @media (width <= 1023px) {
        max-width: 100%;
        height: auto;
        display: block;
    }
}
#contact li.btn a {
    width: 359px;
    height: 104px;
    display: block;
    text-indent: -9999px;
    @media (width <= 1023px) {
        width: auto;
        height: auto;
        text-indent: 0;
    }
}
#contact li.btn a img {
    display: block;
}
/*#contact li.btn a:hover{
	background-position:left bottom;
}*/
/* footer
-------------------------------------------------- */
footer {
    background: #ffffff;
    border-top: 1px solid #d1dcdc;
    padding: 27px 0 30px;
}
footer .inner {
    width: 964px;
    margin: 0 auto;
}
footer .inner dl,
footer .inner dt,
footer .inner dd {
    float: left;
}
footer .inner dt,
footer .inner dd {
    margin-right: 18px;
}
footer .inner dl #map {
    margin-top: 3px;
}
footer .inner p {
    float: right;
    margin-top: 20px;
}
@media (width <= 1023px) {
    /* footer */
    footer {
        padding-left: 15px;
        padding-right: 15px;
    }
    footer .inner {
        width: auto;
        display: flex;
        flex-direction: column;
    }
    footer .inner dl {
        float: none;
        display: grid;
        grid-template-columns: auto auto;
        justify-content: center;
        gap: 12px 8px;
        padding: 0 10px;
        box-sizing: border-box;
    }
    footer .inner dt {
        float: none;
        grid-column: 1 / -1;
        justify-self: center;
        margin-right: 0;
        width: auto;
    }
    footer .inner dd {
        float: none;
        margin-right: 0;
        text-align: left;
    }
    footer .inner p {
        text-align: right;
        margin-top: 15px;
    }
    footer .inner p img {
        max-width: 100%;
        height: auto;
    }
}

/* -----------------------------------------------
 [グロナビ - SP（width <= 1023px）]
-------------------------------------------------- */
@media (width <= 1023px) {
    /* 共通: SP ナビゲーションスタイル */
    #gnavi {
        background: #fff;
        border-top: 1px solid #c6c6c6;
    }
    #gnavi ul {
        width: 100% !important;
        height: auto !important;
        background: none !important;
        margin: 0 !important;
        padding: 3px 0 !important;
        border-bottom: 1px solid #c6c6c6;
    }
    #gnavi li {
        float: none !important;
        width: auto !important;
        display: block !important;
        border-bottom: 1px dotted #c6c6c6;
        text-align: center;
        margin: 0 5px;
    }
    #gnavi li a {
        padding: 14px 20px;
        display: block;
    }
    #gnavi li.first {
        border-top: 1px dotted #c6c6c6;
    }
    #gnavi li.first,
    #gnavi li.last {
        text-align: center !important;
    }
    #gnavi li.first a,
    #gnavi li.last a {
        padding-left: 20px;
        width: auto;
    }
    #gnavi li a img {
        max-width: 100%;
        height: auto;
    }
    #gnavi li a.active {
        background: none;
    }
}