@charset "UTF-8";
/*
 Theme Name: Saifukuji
 Author: Saifukuji
 Template: habakiri
*/

/*------------------------------------------
■ Font
------------------------------------------*/

@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);


/*------------------------------------------
■ Link
------------------------------------------*/

a:link,
a:active,
a:hover,
a:visited {
    color: #277DF6;
}


/*------------------------------------------
■ Link hover effect
------------------------------------------*/

a,
a img {
    transition: 0.5s;
}

a:hover,
a:hover img {
    opacity: 0.4;
    filter: alpha(opacity=40);
    -ms-filter: "alpha( opacity=40)";
}


/*------------------------------------------
■ Base
------------------------------------------*/

::-moz-selection {
    background-color: #BE9124;
    color: #FFF;
}

::selection {
    background-color: #BE9124;
    color: #FFF;
}

body {
    width: 100%;
    background-color: #FFF;
    color: #000;
    font-family: "メイリオ", "ＭＳ Ｐゴシック", "Lucida Grande", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Geneva, Arial, Verdana, sans-serif;
    font-family: YakuHanMPs, "Times New Roman", 游明朝, YuMincho, "Noto Serif Japanese", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    font-size: 1.1em;
    font-weight: 400;
    line-height: 2;
    letter-spacing: 0.15em;
}


/* -- Back page top button  -------------------- */

#page_top {
    width: 50px;
    height: 50px;
    position: fixed;
    right: 50px;
    bottom: 50px;
    background: #BE9124;
    opacity: 0.6;
    border-radius: 50%;
    z-index: 9999;
}

    #page_top a {
        position: relative;
        display: block;
        width: 50px;
        height: 50px;
        text-decoration: none;
    }

    #page_top a::before {
        font-family: "Font Awesome 5 Free";
        content: '\f106';
        position: absolute;
        width: 25px;
        height: 25px;
        top: 0;
        bottom: 40px;
        right: 0;
        left: 0;
        margin: auto;
        font-size: 40px;
        font-weight: bold;
        text-align: center;
        color: #FFF;
    }

    #page_top a:hover {
        opacity: 1;
    }

    #page_top a:hover::before {
        bottom: 50px;
    }


/* -- Page fade in -------------------- */

body {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

    @keyframes fadeIn {
        0% {opacity: 0}
        100% {opacity: 1}
    }

    @-webkit-keyframes fadeIn {
        0% {opacity: 0}
        100% {opacity: 1}
    }


/*------------------------------------------
■ Header
------------------------------------------*/

#header {
    width: 100%;
    color: #FFF;
}

#header .container {
    position: relative;
    padding-top: 100px;
}


/* -- Heading -------------------- */

#header h1 {
    font-weight: normal;
}

#header h2 {
    font-weight: bold;
}


/* -- Signature -------------------- */

.site-branding__heading {
    display: none;
}

/* Common */
#signature {
    position: absolute;
    top: 140px;
    right: -30px;
}

#signature img {
    width: 30%;
}

    @media screen and (max-width: 1199px) {
        #header .container {
            padding-top: 200px;
        }
        #signature {
            top: 10px;
            left: 45%;
        }
        #signature img {
            width: 13%;
        }
    }
    @media screen and (max-width: 991px) {
        #signature img {
            width: 20%;
        }
    }
    @media screen and (max-width: 599px) {
        #header .container {
            padding-top: 120px;
        }
        #signature img {
            width: 30%;
        }
    }

/* Home only */
body.home #signature {
    position: absolute;
    top: 25rem;
    right: 4rem;
}

body.home #signature img {
    width: 90%;
}

    @media screen and (max-width: 1399px) {
        body.home #signature img {
            width: 80%;
        }
    }
    @media screen and (max-width: 1199px) {
        body.home #signature {
            top: 40rem;
            left: 700px;
        }
        body.home #signature img {
            width: 65%;
        }
    }
    @media screen and (max-width: 991px) {
        body.home #signature {
            top: 15rem;
            right: 0;
            left: 500px;
        }
        body.home #signature img {
            width: 60%;
        }
    }
    @media screen and (max-width: 767px) {
        body.home #header .container {
            padding-top: 250px;
        }
        body.home #signature {
            top: 10px;
            left: 45%;
        }
        body.home #signature img {
            width: 20%;
        }
    }
    @media screen and (max-width: 599px) {
        body.home #header .container {
            padding-top: 120px;
        }
        body.home #signature img {
            width: 30%;
        }
    }


/* -- Symbolmark -------------------- */

#symbolmark_01 {
    position: absolute;
    top: 40px;
    left: 40px;
}

#symbolmark_02 {
    position: absolute;
    top: 40px;
    right: 40px;
}


/* -- Global navi (old) -------------------- */

/*
.responsive-nav {
    margin: 2em 0;
}

    #header .responsive-nav .menu-item strong {
        font-weight: bold;
    }

    #header .responsive-nav .menu > .current-menu-item > a,
    #header .responsive-nav .menu > .current_page_item > a {
        color: #BE9124;
    }

.responsive-nav ul.sub-menu li a:hover {
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: "alpha( opacity=100)";
}
*/


/* -- Global navi -------------------- */

.header--center .global-nav #menu-global-menu {
    letter-spacing: -0.4em;
    text-align: left;
    -webkit-display: flex;
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
}

.header--center .global-nav #menu-global-menu > li {
    letter-spacing: 0;
    text-align: left;
    display: inline-block;
    width: 95px;
}

.header--center .global-nav #menu-global-menu > li > a {
    position: relative;
    font-size: 1.9rem;
    text-align: left;
    line-height: 110%;
    display: inline;
    -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
    white-space: nowrap;
    text-decoration: none;
    padding: 20px 10px;
}

.header--center .global-nav #menu-global-menu > li > a > small {
    display: block;
    position: relative;
    font-size: 2.0rem;
    color: #BD9024;
}

/* Dropdown menu */
.header--center .global-nav #menu-global-menu li ul.sub-menu li a {
    font-size: 1.6rem;
    color: #FFF;
}

.header--center .global-nav #menu-global-menu li ul.sub-menu li a:hover {
    opacity: 0.8;
    filter: alpha(opacity=80);
    -ms-filter: "alpha( opacity=80)";
}

/* Smartphone layout menu */
.off-canvas-nav ul li a {
    color: #FFF;
}


/*------------------------------------------
■ Contents
------------------------------------------*/

#contents {
    font-size: 1.4rem;
}


/* -- Components -------------------- */

#contents p {
    margin-bottom: 2em;
    font-size: 1.2em;
}

.section {
    margin: 50px 0;
}

.attention {
    color: #FF2154;
}

#pagetop {
    text-align: right;
    margin: 40px 0;
}

.iframe-box {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 30%;
}

    .iframe-box iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

a.detaillink {
    padding: .3em 1em;
    border: 1px solid #000;
    border-radius: 8px;
    color: #000;
    font-size: 1.8rem;
}


/* -- Bootstrap -------------------- */

.row-height {
    display: flex;
    flex-wrap: wrap;
}


/* -- Heading -------------------- */

.entry__title {
    margin-bottom: 2em;
    font-size: 4em;
    font-weight: normal;
    letter-spacing: .1em;
    line-height: .8;
    color: #BD9024;
}

    .entry .entry__title {
        margin-bottom: 1em;
        font-size: 3.4em;
        font-weight: bold;
        line-height: 1.2;
    }

.heading {
    margin-top: 2em;
    margin-bottom: 1em;
    padding-left: 1em;
    border-left: 10px solid #000;
    font-size: 2.8rem;
    font-weight: normal;
    letter-spacing: .1em;
    line-height: 1;
}

    span.en {
        font-size: .6em;
        color: #999;
        letter-spacing: .06em;
    }

h3 {
    font-size: 1.2em;
    font-weight: bold;
}


/* -- Home : Update -------------------- */

ul.su-posts-list-loop {
    list-style-type: none;
    padding-left: 0;
}


/* -- Home : Recently events -------------------- */


/* -- Page : English title -------------------- */
p.pagetitle_en {
    margin-top: -3em;
    font-size: 1.7rem;
    color: #BD9024;
}


/* -- Contact : notice -------------------- */

#contact #body dl dt {
    margin-bottom: 1em;
    font-weight: bold;
    font-size: 1.1em;
}

    #contact #body dl dd ul li {
        padding-left: 1em;
        text-indent: -1em;
    }

    #contact #body dl dd ul li::before {
        content: '◎';
        color: #373B3F;
    }


/* -- Form -------------------- */

table {
    border-collapse: collapse;
    margin: 60px 0;
}

table p {
    text-align: center;
    margin: 30px auto 40px;
}

input[type="submit"],
input[type="text"],
input[type="number"],
input[type="email"],
select,
textarea,
button {
    -moz-appearance: none;
    -webkit-appearance: none;
    box-shadow: none;
    outline: none;
    border: none;
}

select {
    border: 1px solid #d7d7d7;
    border-radius: 5px;
    padding: 6px 15px;
}

input[type="text"],
input[type="number"],
input[type="email"],
textarea {
    background: #f8f8f8;
    display: block;
    font-size: 16px;
    padding: 12px 15px;
    width: 480px;
    transition: 0.8s;
    border-radius: 0;
}

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

  input[type="text"],
  input[type="number"],
  input[type="email"],
  textarea {
      width: 100%;
      max-width: 480px;
  }
}

input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
textarea:focus {
    background: #e9f5fb;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

textarea[name="contents"] {
    display: inline-block;
    width: 100%;
    height: 200px;
}

input[type="submit"] {
    box-sizing: border-box;
    position: relative;
    display: block;
    margin: 30px auto 0;
    background-color: #e4eeef;
    cursor: pointer;
    border: 1px solid #e4eeef;
    color: #000;
    text-align: center;
    text-decoration: none;
    line-height: 1.5;
    outline: none;
    transition: all .5s;
    padding: 20px 100px;
}

input[type="submit"]:hover {
    background: #cae1e3;
    color: #000;
    border: 1px solid #cae1e3;
}

input::-moz-placeholder, textarea::-moz-placeholder {
    color: #ccc;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
    color: #ccc;
}

input::placeholder,
textarea::placeholder {
    color: #ccc;
}

::-webkit-input-placeholder {
    color: #ccc;
    opacity: 1;
}

::-moz-placeholder {
    color: #ccc;
    opacity: 1;
}

:-ms-input-placeholder {
    color: #ccc;
    opacity: 1;
}

.form-table {
    width: 100%;
}

.form-table th,
.form-table td {
    border-top: 1px solid #d7d7d7;
    border-bottom: 1px solid #d7d7d7;
    padding: 20px;
}

.form-table th {
    padding-left: 50px;
    position: relative;
    text-align: left;
    width: 300px;
}

.form-table td p{
  margin: 0.5em 0 !important;
}

@media screen and (max-width: 599px) {
    .form-table th,
    .form-table td {
        display: block;
        width: 100%;
        border-bottom: none;
    }
}

.must {
	background: #FF1A00;
	color: #FFF;
	border-radius: 3px;
	font-size: 12px;
	margin-right: 10px;
	padding: 5px 10px;
	letter-spacing: 0.2em;
}

.mwform-zip-field br{
  display: none;
}

.mwform-radio-field br{
  display: none;
}

.mwform-tel-field br{
  display: none;
}


/*------------------------------------------
■ Footer
------------------------------------------*/
#container {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

#footer {
    margin-top: auto;
    width: 100%;
    padding-top: 20px;
    background-color: #CCC;
    color: #000;
    font-size: 1.4rem;
}

#footer a:link,
#footer a:active,
#footer a:hover,
#footer a:visited {
    text-decoration: none;
}

#footer div {
    display: flex;
}


/* -- Address & Copyright -------------------- */

address {
    width: 50%;
    padding-top: 20px;
    padding-bottom: 30px;
    font-style: normal;
}

#address {
    padding-left: 2em;
    text-align: left;
}

#copyright {
    text-align: right;
    padding-right: 2em;
}

a[href^="tel:"] {
    pointer-events: none;
    color: #000;
}


/*------------------------------------------
■ Commerce
------------------------------------------*/
/* -- colorme_page=items -------------------- */
.commerce_items {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.commerce_items dl {
    box-sizing: border-box;
    flex: 0 1 calc(100% / 4 - 10px);
    margin-bottom: 20px;
    margin-left: 10px;
}

.commerce_items dl dt {
    margin-bottom: 1em;
}

.commerce_items dl dt img {
    width: 100%;
    height: 200px;
    -o-object-fit: cover;
       object-fit: cover;
}

.commerce_items dl a {
    color: #000;
}

/* -- pagenation -------------------- */

ul.page-numbers {
    list-style: none;
    padding: 2em;
    display: flex;
    justify-content: center;
    background: #f3f3f3;
}

ul.page-numbers li {
    display: block;
    width: 50px;
    height: 50px;
    margin: 2px;
    line-height: 50px;
    text-align: center;
    font-size: 1.6rem;
    font-weight: bold;
    text-decoration: none;
    background: #fff;
    color: #222;
    transition: .3s;
}

ul.page-numbers li:hover {
    background: gold;
    border-radius: 100%;
}

/*------------------------------------------
■ Responsive: switch
------------------------------------------*/

.pc {}

.tb,
.sp {
    display: none;
}


/*------------------------------------------
■ Responsive: 959px-600px
------------------------------------------*/

@media screen and (max-width: 959px) {
    /* -- common -------------------- */
    .pc {
        display: none;
    }
    .tb {
        display: inline-block;
    }
    /* -- header -------------------- */
    /* -- body -------------------- */
    .iframe-box {
        padding-top: 100%;
    }
    body#home {}
        #home_main #main-massege {
            top: -40px;
            left: 10px;
        }
        #home_main #main-massege img {
            width: 40%;
        }
        #home .content-wrap {
            flex-flow: column nowrap;
        }
        #home .content-wrap .content-sub,
        #home .content-wrap .content-main {
            width: 100%;
            padding: 0;
        }
        #home .content-wrap .content-main dl {
            flex-flow: column nowrap;
            margin-top: 50px;
        }
        #home .content-wrap .content-main dl dt,
        #home .content-wrap .content-main dl dd {
            width: 100%;
        }
        #home .content-wrap .content-main dl dt {
            border: none;
            font-weight: bold;
        }
    body#access {}
        #accessmap {
            flex-flow: column nowrap;
        }
        #accessmap #schematic,
        #accessmap #googlemap {
            width: 100%;
        }
        #accessmap #schematic {
            margin-bottom: 30px;
        }
        #accessmap #googlemap {
            margin: 0;
        }
        #access-group .column-wrap {
            flex-flow: column nowrap;
            margin-left: 0;
        }
        #access-group .column-wrap .column-label,
        #access-group .column-wrap .column {
            width: 100%;
            margin: 20px 0;
        }
        #access-group .column-wrap dl.column {
            height: auto;
            border: none;
        }
    body#contact {}
        #contactform div {
            flex-flow: column nowrap;
        }
        #contactform label {
            width: 100%;
        }
    /* -- footer -------------------- */
    #footer div {
        flex-flow: column nowrap;
    }
    address {
        width: 100%;
    }
    #address, #copyright {
        padding: 1em 0 2em 0;
        text-align: center;
    }
}


/*------------------------------------------
■ Responsive: 599px-
------------------------------------------*/

@media screen and (max-width: 599px) {
    /* -- common -------------------- */
    .sp {
        display: inline-block;
    }
    #page_top {
        right: 20px;
        bottom: 20px;
    }
    /* -- header -------------------- */
    #header #symbolmark_01,
    #header #symbolmark_02 {
        position: relative;
        top: 0;
        left: 0;
        right: 0;
        width: 40%;
        margin-top: 20px;
    }
    #header #symbolmark_01 {
        float: left;
        padding-left: 20px;
    }
    #header #symbolmark_02 {
        float: right;
        padding-right: 20px;
        text-align: right;
    }
    #header #symbolmark_01 img,
    #header #symbolmark_02 img {
        width: 50%;
    }
    #header h1.site-branding__heading {
        text-align: center;
    }
    #responsive-btn {
        position: fixed !important;
        border: none;
        margin: 0;
        font-size: 22px;
    }
    /* -- body -------------------- */
    .iframe-box {
        padding-top: 75%;
    }
    .entry__title {
        line-height: 1;
        font-size: 3em;
    }
    body#home {}
        #home_main #main-massege {
            top: -20px;
            left: 10px;
        }
        #home_main #main-massege img {
            width: 35%;
        }
        #home .content-wrap {
            flex-flow: column nowrap;
        }
        #home .content-wrap .content-sub,
        #home .content-wrap .content-main {
            width: 100%;
            padding: 0;
        }
        #home .content-wrap .content-main dl {
            flex-flow: column nowrap;
            margin-top: 50px;
        }
        #home .content-wrap .content-main dl dt,
        #home .content-wrap .content-main dl dd {
            width: 100%;
        }
        #home .content-wrap .content-main dl dt {
            border: none;
            font-weight: bold;
        }
        #home .content-wrap .content-main dl dd {
            font-size: .9em;
        }
    body#access {}
        #accessmap {
            flex-flow: column nowrap;
        }
        #accessmap #schematic,
        #accessmap #googlemap {
            width: 100%;
        }
        #accessmap #schematic {
            margin-bottom: 30px;
        }
        #accessmap #googlemap {
            margin: 0;
        }
        #access-route dl {
            flex-flow: column nowrap;
            margin-left: 0;
        }
        #access-route dl dt,
        #access-route dl dd {
            width: 100%;
        }
        #access-route dl dt p {
            text-align: center;
        }
        #access-route dl dt img {
            margin: 30px 0;
        }
        #access-route dl dd {
            padding: 0;
        }
        #access-group .column-wrap {
            flex-flow: column nowrap;
            margin-left: 0;
        }
        #access-group .column-wrap .column-label,
        #access-group .column-wrap .column {
            width: 100%;
            margin: 20px 0;
        }
        #access-group .column-wrap dl.column {
            height: auto;
            border: none;
        }
    body#contact {}
        #contactform div {
            flex-flow: column nowrap;
        }
        #contactform label {
            width: 100%;
        }
    /* -- footer -------------------- */
    address {
        width: 100%;
        font-size: 1.4rem;
    }
    #address, #copyright {
        padding: 1em 0 2em 0;
        text-align: center;
    }
    a[href^="tel:"] {
        pointer-events: auto;
    }
    #footer a:link,
    #footer a:active,
    #footer a:visited {
        text-decoration: underline;
    }
    /* -- commerce -------------------- */
    .commerce_items {
        flex-wrap: wrap;
    }
    .commerce_items dl {
        flex: 0 1 100%;
    }
}