﻿/* color */
body,.txt_color_nomal{color: #333333;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #56383A} /* メインカラー */
.txt_color2{color: #CDB6BC} /* サブカラー */
.txt_color3{color: #c1a37d} /* アクセントカラー1 */
.txt_color4{color: #FFF7F0} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #56383A} /* メインカラー */
.bg_color2{background-color: #CDB6BC} /* サブカラー */
.bg_color3{background-color: #c1a37d} /* アクセントカラー1 */
.bg_color4{background-color: #FFF7F0} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important}


/* border-color ※!important */
.border_color1{border-color: #56383A}
.border_color2{border-color: #CDB6BC}
.border_color3{border-color: #c1a37d}
.border_color4{border-color: #FFF7F0}


/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_nomal:hover{color: #333333;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #56383A} /* メインカラー */
.hvr_txt_color2:hover{color: #CDB6BC} /* サブカラー */
.hvr_txt_color3:hover{color: #c1a37d} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #FFF7F0} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #56383A} /* メインカラー */
.hvr_bg_color2:hover{background-color: #CDB6BC} /* サブカラー */
.hvr_bg_color3:hover{background-color: #c1a37d} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #FFF7F0} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important}

/* border-color ※!important */
.hvr_border_color1:hover{border-color: #56383A}
.hvr_border_color2:hover{border-color: #CDB6BC}
.hvr_border_color3:hover{border-color: #c1a37d}
.hvr_border_color4:hover{border-color: #FFF7F0}

main {
    background-color: #fdfbfc;
}
h2, h3, h4 {
    font-weight: bold;
}
.linkStyle {
    color: #56383A;
}
.back1:before, .back2:before/*, .menu .square_box*/ {
    background-image: url(./Dup/img/haikei.png);
    background-size: 70%;
}
.menu .square_box {
    background-color: rgba(0,0,0,0);
}
#intro_wrap {
    background-image: url(./Dup/img/intro_back.jpg);
    background-size: cover;
    background-position: center;
    box-shadow: 0px 4px 9px rgb(50, 50, 50, 0.1);
}
.tyou1:after {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/tyou1.png);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    left: -20px;
    width: 50px;
    height: 50px;
    animation: fuwafuwa 3s linear infinite;
}
.tyou2:after {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/tyou2.png);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    right: -20px;
    width: 50px;
    height: 50px;
    animation: fuwafuwa 3s linear infinite;
}
@keyframes fuwafuwa {
  0% { transform: translateY(0) }
  33.33333% { transform: translateY(-10px) }
  66.66667% { transform: translateY(0) }
  100% { transform: translateY(0) }
}
.intro_box {
    background-color: rgba(255, 255, 255, 0.6);
    padding: 2%;
}
header.scr_header #logo {
    max-width: 100px;
}
.no1 .fl {
    width: 80%!important;
    max-width: 800px !important;
}
#logo {
    max-width: 130px;
    box-sizing: border-box;
}
.cms_3-d .box_wrap {
    display: block;
}
.cms_3-d .border_rad10 {
    margin: 30px 10px;
    padding: 10px 20px;
}
.cms_3-d .box_txt2 {
    color: #1a1a1a;
}
#contents3 .con_box {
    background-image: url(./Dup/img/con4_back.png);
    background-position: center;
    background-size: cover;
}

.fadein {
  opacity : 0;
  transform : translate(0, 100px);
  transition : all 1s;
}
 
.fadein.active{
  opacity : 1;
  transform : translate(0, 0);
}
#logo2 .width_300-max {
    width: 100%;
    max-width: 250px;
}
#contents3 .con_box {
    position: relative;

}

#contents3 .con_box:after {
    position: absolute;
    left: 0; top: 0; right: 0; bottom: 0;
    -moz-box-shadow: inset 0px 0px 15px 15px #fff;
    -webkit-box-shadow: inset 0px 0px 15px 15px #fff;
    box-shadow: inset 0px 0px 15px 15px #fff;
    content: " ";
}
#contents3 .num {
    z-index: 1;
}
.tel_box {
    width: 100%;
    max-width: 350px;
}
.tel_box .font_10up_sp {
    font-size: -webkit-calc(1rem + 8px);
    font-size: calc(1rem + 8px);
}

.banner:hover {
    opacity: 0.6;
}
.cms_2-c .box_txt1 {
    font-weight: bold;
}
#page10 .more_btn {
    position: relative;
    text-transform: none;
    transition: all 500ms cubic-bezier(0.77, 0, 0.175, 1);
    cursor: pointer;
    user-select: none;
    padding-bottom: 8px!important;
}
#map {
    display: none;
}
.tel_mail_box {
    display: flex;
}
.mail_box .font_10up {
    font-size: -webkit-calc(1rem + 0px);
    font-size: calc(1rem + 0px);
}
#footer .tel_bt {
    display: none;
}
/* タブレット */
@media screen and (max-width: 768px){
    .tyou2:after {
    top: -31px;
    right: -10px;
    width: 50px;
    height: 50px;
}
.cms_2-a .cate_box .grid_6 {
    width: 90%!important;
    margin: 0 auto;
}
#logo {
    max-width: 110px;
    box-sizing: border-box;
}
header.scr_header #logo {
    max-width: 90px;
}
#logo2 .width_300-max {
    width: 100%;
    max-width: 210px;
}
.page_title_box {
    padding-right: 10px;
    padding-left: 10px;
}
.nav_menu_more a .icon:before {
    display: none;
}
.tyou2:after {
    background-image: none;
}
.tyou2:after {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/tyou1.png);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    right: 40px;
    width: 40px;
    height: 40px;
    animation: fuwafuwa 3s linear infinite;
}
.tyou1:after {
    background-image: none;
}
.tyou1:after {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/tyou2.png);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    left: 40px;
    width: 40px;
    height: 40px;
    animation: fuwafuwa 3s linear infinite;
}
.cms_2-c .cate_box .width_50per, #cms_2-c .cate_box .width_50per {
    width: 90%!important;
    margin: 0 auto;
}
.cms_2-c .flex_order2, #cms_2-c .flex_order2 {
    order: 1;
}
.tel_mail_box {
    display: block;
}
.mail_txt {
    text-align: left;
}
}

/* スマホ */
@media screen and (max-width: 667px){
    .cms_3-d .border_rad10 {
    margin: 30px 0px;
    padding: 10px 10px;
}
.tyou1:after {
    background-image: none;
}
.tyou1:after {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/tyou1.png);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    left: -20px;
    width: 40px;
    height: 40px;
    animation: fuwafuwa 3s linear infinite;
}

.tyou2:after {
    background-image: none;
}
.tyou2:after {
    position: absolute;
    content: "";
    background-image: url(./Dup/img/tyou2.png);
    background-size: contain;
    background-repeat: no-repeat;
    top: -1px;
    right: -21px;
    width: 40px;
    height: 40px;
    animation: fuwafuwa 3s linear infinite;
}


#logo2 .width_300-max {
    width: 100%;
    max-width: 180px;
}
#logo {
    max-width: 90px;
    box-sizing: border-box;
}
header.scr_header #logo {
    max-width: 80px;
}
#page_title .page_title_box {
    padding-bottom: 28px;
    width: 270px;
}
.banner {
    width: 280px;
    margin-bottom: 50px;
}
.no1 .fl {
    width: 80% !important;
    max-width: 300px !important;
}
.tel_box .font_10up_sp {
    font-size: -webkit-calc(1rem + 7px);
    font-size: calc(1rem + 7px);
    padding: 10px 0;
}
.kome {
    width: 61%;
    margin: 0 auto;
}
}

/*IEのみ*/
@media all and (-ms-high-contrast: none) {
    .back1:before, .back2:before/*, .menu .square_box*/ {
    background-image: url(./Dup/img/haikei2.png) !important;
    background-size: 70%;
}
}