@import url('https://fonts.googleapis.com/css2?family=Noto%20Sans%20JP&family=Noto%20Serif%20JP&family=Spartan:wght@500&display=swap');

body, .font_sans-serif{font-family: 'Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif}

header .contact_box, #page_title p, #copyright, #info .tel, .more, #sp_header li:last-child, #top_cms .cms_title p, .date, #page8 #contact_tel{font-family: 'Spartan', 'Noto Sans JP', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif}

#catch h2, #contents h2, #contents2 h2, #contents3 h2, #top_cms h2, #page_title h2, .cate_title{font-family: 'Noto Serif JP', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"}

/* color */
.txt_color1{color: #AD9173} /* メインカラー */
.txt_color2{color: #F7F6F5} /* サブカラー */
.txt_color3{color: #DDAE19} /* アクセントカラー1 */
.txt_color4{color: #E5E2DA} /* アクセントカラー2 */

/* background-color */
.bg_color1{background-color: #AD9173} /* メインカラー */
.bg_color2{background-color: #F7F6F5} /* サブカラー */
.bg_color3{background-color: #DDAE19} /* アクセントカラー1 */
.bg_color4{background-color: #E5E2DA} /* アクセントカラー2 */


/* border-color ※!important */
.border_color1{border-color: #AD9173}
.border_color2{border-color: #F7F6F5}
.border_color3{border-color: #DDAE19}
.border_color4{border-color: #E5E2DA}

/* hover ---------------------------------------------------------------------------------------------*/

/* color */
.hvr_txt_color1:hover{color: #AD9173} /* メインカラー */
.hvr_txt_color2:hover{color: #F7F6F5} /* サブカラー */
.hvr_txt_color3:hover{color: #DDAE19} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #E5E2DA} /* アクセントカラー2 */

/* background-color */
.hvr_bg_color1:hover{background-color: #AD9173} /* メインカラー */
.hvr_bg_color2:hover{background-color: #F7F6F5} /* サブカラー */
.hvr_bg_color3:hover{background-color: #DDAE19} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #E5E2DA} /* アクセントカラー2 */

/* border-color ※!important */
.hvr_border_color1:hover{border-color: #AD9173}
.hvr_border_color2:hover{border-color: #F7F6F5}
.hvr_border_color3:hover{border-color: #DDAE19}
.hvr_border_color4:hover{border-color: #E5E2DA}

/* other ---------------------------------------------------------------------------------------------*/

.linkStyle{transition: 0.3s;color: #DDAE19}
.linkStyle:hover{opacity: 0.7}

.more a{padding-top: 15px}
footer .map{display: none}
.font_bold{font-weight: normal}

header .contact_box .header_contact_link{display: none}
#header .nav_box{background-image: url(https://macheriephoto.com/Dup/img/bg_img.jpg)}
.index_header .nav_box::before, .index_header .nav_box::after, #contents2::before, #contents3::before{position: absolute;content: "";pointer-events: none;width: 100px;height: 100px;background-image: url(https://macheriephoto.com/Dup/img/corner.png);background-size: contain;z-index: 1}
.index_header .nav_box::before, #contents2::before{top: 20px;right: 20px}
.index_header .nav_box::after, #contents3::before{bottom: 20px;left: 20px;transform: rotate(180deg)}
.hamburger, p.gotop a{background-color: #A3876D}
.con_wrap{padding-top: 50px;background-image: url(https://macheriephoto.com/Dup/img/bg_img3.png);background-size: 100% 80px;background-repeat: no-repeat}
#contents .contents_inner h2{margin-bottom: 30px}
#contents .contents_inner .contents_txt{position: relative;right: -20px;z-index: 1;padding-top: 80px;padding-bottom: 80px}
#contents .contents_inner .contents_txt::before, #contents .contents_inner .contents_txt::after{position: absolute;content: "";width: 100px;height: 20px;left: 0;right: 0;margin: auto;background-image: url(https://macheriephoto.com/Dup/img/bg_img2.png);background-size: contain}
#contents .contents_inner .contents_txt::before{top: 20px}
#contents .contents_inner .contents_txt::after{bottom: 20px;transform: rotate(180deg)}
#contents .contents_inner .contents_txt p{margin-right: 0;padding: 0}
#contents2, #contents3{background-image: url(https://macheriephoto.com/Dup/img/bg_img.jpg);position: relative}
#contents2 h2, #contents3 h2{padding-bottom: 30px;margin-bottom: 40px}
#contents2 h2::after, #contents3 h2::after{position: absolute;content: "";width: 40px;height: 1px;background-color: #fff;left: 0;bottom: 0}
#contents2 h2::after{left: 55px}
#contents3 .contents_img{width: 63.66667%!important;padding-bottom: calc(80%*410/837);}
#contents3 .contents_txt h2, #contents3 .contents_txt p{padding-right: 55px;}
#contents3 .contents_img span.before{display: inline-block;content: "";width: 200%;height: 200%;position: absolute;bottom: 0;right: 0;left: 0;margin: auto;z-index: 50;opacity: 1;transition: .8s cubic-bezier(0.5, 0.1, 0.2, 1) 0.2s;}
#contents3 .contents_img.start span.before{opacity: 1;left: 100%}
#contents2 .contents_txt h2 span, #contents3 .contents_txt h2 span{display: none}
@media screen and (max-width: 1481px){
#contents3 .contents_txt {width: 41.33333%!important;}
#contents3 .contents_img{width: 58.66667%!important;}
}
@media screen and (max-width: 1300px){
#contents3 .contents_txt{padding-right: 40px;width: 42.33333%!important}
}
@media screen and (max-width: 1115px){
#contents3 .contents_txt {width: 46.33333%!important;}
}

.cate_title{background-color: transparent;padding: 0;margin: 0;display: block;border: none;width: 100%!important;font-size: 24px;text-align: left;padding-bottom: 5px;margin-bottom: 50px;border-bottom: solid 1px #333;color: #333;font-weight: normal}
#cms_5-a .cate_title{margin-bottom: 0!important}

#top_cms .cms_title h2{font-size: 20px;color: #333}
#top_cms .cms_title p{font-size: 16px;opacity: 0.4}
#page_title h2{color: #333}
#page_title p{color: #AD9173}

/** tablet 780 **/
@media screen and (max-width: 768px){
.con_wrap{background-size: 100% 50px}
#contents2 h2::after, #contents3 h2::after{left: 40px}
#contents3 .contents_img{padding-bottom: calc(100%*458/837);}
#contents3 .contents_txt {padding: 80px 20px 60px;}
#contents3 .contents_txt, #contents3 .contents_img{width: 100%!important;}
#contents3 .contents_txt h2, #contents3 .contents_txt p{padding-left: 0;padding: 0 40px;}
#contents2 .contents_txt h2, #contents3 .contents_txt h2{padding-bottom: 30px}
.index_header .nav_box{padding: 50px;padding-right: 0}
.all_header #global-nav ul li{width: auto}
#contents .contents_inner .contents_txt{right: 0}
#contents .contents_inner h2{padding-bottom: 20px}
}

/** mobile 750 **/
@media screen and (max-width: 667px){
.index_header .nav_box::before, .index_header .nav_box::after{display: none}
.index_header #logo, #logo{max-width: 75px}
.index_header .nav_box, .nav_box{padding: 10px 15px}
#contents2 h2::after, #contents3 h2::after{left: 30px}
#contents3 .contents_txt{padding: 80px 10px 60px;}
#contents3 .contents_txt h2, #contents3 .contents_txt p{padding: 0 30px;}
#contents2 .contents_txt h2, #contents3 .contents_txt h2{padding-bottom: 30px}
.hamburger{background-color: transparent}
#header .nav_box{background-color: #A3876D}
.cate_title{font-size: 20px}
.fat-nav.active li{padding: 0}
#global-nav ul li a .after, .fat-nav.active li a .after{display: none}
}

/** IE **/
@media all and (-ms-high-contrast:none) {
body, .font_sans-serif, header .contact_box, #page_title p, #copyright, #info .tel, .more, #sp_header li:last-child, #top_cms .cms_title p, .date, #page8 #contact_tel{font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif}
#catch h2, #contents h2, #contents2 h2, #contents3 h2, #top_cms h2, #page_title h2, .cate_title{font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"}
.more a{padding-top: 12px}
}