@charset "utf-8"; 

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
カスタム投稿　幅固定
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
body.single-works #main_area {
	width: 1000px;
}
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
キーフレームアニメーション「ゆらゆら」
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@keyframes yurayura {
    0% {
        transform: translateY(-3px);
    }

    100% {
        transform: translateY(0px);
    }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ヘッダー(インフォメーション)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#header_frame {
    height: 0;
    margin: 0 auto 0;
}

#header_frame .logo {
    display: none;
}

#header_frame > .inner {
    padding: 15px 0;
    height: 100px;
    display: flex;
    align-items: center;
    position: relative;
}

#header_frame > .inner .left {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
グローバルナビ（上段）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#h_navi_sub {
    background-color: #fff;
}

div#body_inner #header_fixed_zone.fix_exe i.icon-home1 {
    position: relative;
    width: 45px;
    height: 100%;
}

div#body_inner #header_fixed_zone .icon-home1:before {
    content: '';
    width: 30px;
    height: 30px;
    background: url(https://madoiro-reform.com/wordpress/wp-content/themes/cyber-child/images/home_icon.png) no-repeat 50% / contain;
    position: absolute;
    bottom: 1px;
    left: 0;
}

div#body_inner #header_fixed_zone:not(.fix_exe) .icon-home1:before {
    background: none;
}

body.home div#body_inner .fix_exe .icon-home1:before {
    content: "";
    width: 30px;
    height: 30px;
    display: block;
}

div#body_inner #header_fixed_zone.fix_exe {
    box-shadow: 0 0 6px rgba(3,3,3,.2);
    margin-top: -45px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
グローバルナビ（下段／親のスタイル）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#h_navi_main ul:not(.sub-menu) {
    justify-content: unset;
}

#h_navi_main {
    margin: 0 auto;
    background-color: #fff;
}

#header_fixed_zone:not(.fix_exe) #h_navi_main ul li:first-child {
    min-width: 238px;
    display: flex;
    align-items: center;
}

#header_fixed_zone:not(.fix_exe) #h_navi_main ul li:first-child a {
    width: 208px;
    height: 65px;
    background: url(https://madoiro-reform.com/wordpress/wp-content/themes/cyber-child/images/logo.png) no-repeat;
}

#h_navi_main ul:not(.sub-menu) > li {
    height: 100px;
}

#h_navi_main ul:not(.sub-menu) > li[class*='current'] > a, #h_navi_main ul:not(.sub-menu) > li > a:hover {
    background-color: transparent;
    color: #010101;
}

#h_navi_main ul:not(.sub-menu) >*:not(:first-child) a {
    max-height: 35px;
    font-size: 15px;
    font-weight: bold;
    border-left: 1px solid #dbdbdb;
    color: #010101;
    position: relative;
    top: calc(100% - 45px);
}

#h_navi_main ul:not(.sub-menu) >*:first-child a {
    border: none;
}

/*----------contact---------*/
#h_navi_main ul:not(.sub-menu) > li.contact {
    background-color: #c53800;
}

#header_fixed_zone:not(.fix_exe) #h_navi_main ul:not(.sub-menu) > li.contact {
    position: relative;
    width: 105px;
}

#h_navi_main ul:not(.sub-menu) > li.contact a {
    background-color: #c53800;
    color: #fff;
    border: none;
}

#header_fixed_zone:not(.fix_exe) #h_navi_main ul li.contact a {
}

#header_fixed_zone #h_navi_main ul:not(.sub-menu) > li.contact a:before {
    height: 22px;
    width: 22px;
    background-color: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    content: "\f003";
    font-family: "icomoon";
    font-size: 22px;
    color: #fff;
    font-weight: normal;
    position: static;
    opacity: 1;
    margin: 0 5px 3px 0;
    transform: translateY(0px);
}

#header_fixed_zone:not(.fix_exe) #h_navi_main ul:not(.sub-menu) > li.contact a:before {
    position: absolute;
    top: -26px;
    left: calc(50% - 13px);
}

/*----------reserve---------*/
#h_navi_main ul:not(.sub-menu) > li.reserve {
    background-color: #271605;
    position: relative;
}

#header_fixed_zone:not(.fix_exe) #h_navi_main ul:not(.sub-menu) > li.reserve {
    width: 105px;
}

#h_navi_main ul:not(.sub-menu) > li.reserve a {
    border: none;
    color: #fff;
}

#header_fixed_zone:not(.fix_exe) #h_navi_main ul:not(.sub-menu) > li.reserve a {
    background-color: #271605;
}

#h_navi_main ul:not(.sub-menu) > li.reserve a:hover {
    background-color: #271605;
    color: #fff;
}

#h_navi_main ul:not(.sub-menu) > li.reserve a:before {
    content: "";
    width: 30px;
    height: 30px;
    background: url(https://madoiro-reform.com/wordpress/wp-content/themes/cyber-child/images/calendar_white.svg) no-repeat;
    opacity: 1;
    display: inline-block;
    position: static;
    margin: 0;
    transform: translateY(0px);
}

#header_fixed_zone:not(.fix_exe) #h_navi_main ul:not(.sub-menu) > li.reserve a:before {
    content: "";
    width: 30px;
    height: 30px;
    background: url(https://madoiro-reform.com/wordpress/wp-content/themes/cyber-child/images/calendar_white.svg) no-repeat;
    margin-right: 2px;
    position: absolute;
    top: -26px;
    left: calc(50% - 13px);
}

/*---ナビhover---*/
#h_navi_main ul:not(.sub-menu) >*:not(:first-child) a:before {
    content: "";
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 70%;
    height: 1px;
    background: #c53800;
    opacity: 1;
    -webkit-transition: all .8s cubic-bezier(.19,1,.22,1);
    transition: all .8s cubic-bezier(.19,1,.22,1);
    -webkit-transition-timing-function: cubic-bezier(.19,1,.22,1);
    transition-timing-function: cubic-bezier(.19,1,.22,1);
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    opacity: 0;
}

#h_navi_main ul:not(.sub-menu) >* a:hover:before {
    opacity: 1;
    height: 2px;
    -webkit-transform: translateY(0);
}

#h_navi_main ul:not(.sub-menu) > li.contact a:hover:before,#h_navi_main ul:not(.sub-menu) > li.reserve a:hover:before {
    animation: yurayura .3s -1s ease-in-out infinite alternate;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
フッター(ナビ)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
div#f_navi_wrap {
    background: #c53800;
}

body.home div#f_navi_wrap {
    display: none;
}

div#f_navi_other > * {
    border: none;
}

div#f_navi_wrap ul:not(.sub-menu) > li > a {
    color: #fff;
}

div#f_navi_wrap ul:not(.sub-menu) > li:not(.home) > a:before {
    background: #fff;
}

div#f_navi_wrap p.copy_link a {
    color: #fff;
}
