﻿body,.txt_color_nomal{color: #4d4d4d;}
.txt_white{color: white;}
.txt_red{color: #E75C5C;}
.txt_color1{color: #5a7c6d;} /* メインカラー */
.txt_color2{color: #F1DBBF;} /* サブカラー */
.txt_color3{color: #5a7c6d;} /* アクセントカラー1 */
.txt_color4{color: #DEF5E5;} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: #4d4d4d;} /* 黒背景 */
.bg_color1{background-color: #5a7c6d;} /* メインカラー */
.bg_color2{background-color: #FCF8E8;} /* サブカラー */
.bg_color3{background-color: #5a7c6d;} /* アクセントカラー1 */
.bg_color4{background-color: #DEF5E5;} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important;}


/* border-color ※!important */
.border_white{border-color: white;}
.border_black{border-color: #cccccc;}
.border_color1{border-color: #5a7c6d;}
.border_color2{border-color: #FCF8E8;}
.border_color3{border-color: #5a7c6d;}
.border_color4{border-color: #DEF5E5;}


/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_nomal:hover{color: #4d4d4d;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #5a7c6d;} /* メインカラー */
.hvr_txt_color2:hover{color: #FCF8E8;} /* サブカラー */
.hvr_txt_color3:hover{color: #5a7c6d;} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #DEF5E5;} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white;} /* 白背景 */
.hvr_bg_black:hover{background-color: #4d4d4d;} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #5a7c6d;} /* メインカラー */
.hvr_bg_color2:hover{background-color: #FCF8E8;} /* サブカラー */
.hvr_bg_color3:hover{background-color: #c5d4cd;} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #DEF5E5;} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important;}


/* border-color ※!important */
.hvr_border_white:hover{border-color: white;}
.hvr_border_black:hover{border-color: #cccccc;}
.hvr_border_color1:hover{border-color: #5a7c6d;}
.hvr_border_color2:hover{border-color: #FCF8E8;}
.hvr_border_color3:hover{border-color: #5a7c6d;}
.hvr_border_color4:hover{border-color: #DEF5E5;}

/*個別スタイル*/

.cms_box .cms_box_bg{
    height: 34%;
}

section .pd_t-100px{
    padding-top: 50px;
}

#logo2{
    text-align: center;
}

header #logo{
    max-width: 150px;
}

header.bg_color1{
    background-color: #c5d4cd;
}

header .txt_white{
    color: #5a7c6d;
}

header .border_white{
    border-color: #5a7c6d;
}

.button_container span{
        background: #5a7c6d;
}

#s_content2 .font_6up {
    font-size: calc(1rem + 5px);
}

.intro_img div{
    top: -22%;
}

.intro_img a::before {
    border: none;
}

.sf_copy.mg_t-20px{
    text-align: center;
}

.sns_link.flex_center-left{
    justify-content: center;
}　

footer p{
    text-align: center;
}

#cms_2-h .box_title1{
    font-weight:bold;
}

.border_color2 {
    border-color: #db8677;
}

#cms_3-a h4{
    font-weight: bold;
}

.font_8up {
    font-size: calc(1rem + 12px);
}

.font_6up{
    font-size: calc(1rem + 8px);
}

.font_2up{
    font-size: calc(1rem + 5px);
}

#banner{
    text-align: center;
    margin: 40px;
}

#banner p{
    margin-bottom: 15px;
}

#banner img{
    width: 20%;
}

#cms_3-e .cate_box:first-of-type .box_title3{
    padding-top: 0;
}

#cms_3-e .box_title3{
    font-size: 140%;
    color: #db8677;
}

#cms_3-e .pd_10px {
    padding: 0px; 
}

.sub_cate_txt1 {
    margin-bottom: 30px;
}

/*タブレット用（768px以下）
--------------------------------------------------------------------------*/
@media  screen and (max-width: 768px){
    .cms_box .cms_box_bg{
    height: 115px;
}
}

/*スマホ用（667px以下）
--------------------------------------------------------------------------*/
@media  screen and (max-width: 667px){
header #logo{
    max-width: 100px;
}
    #banner img{
    width: 80%;
}

#page_title h2{
    font-size: calc(1rem + 7px);
}

.menu-box .font_2up {
    font-size: calc(1rem + 2px);
}

.overlay{
    top: 87px;
}

.cms_box .cms_box_bg{
    height: 100px;
}

.font_8up {
    font-size: calc(1rem + 7px);
}

.font_6up{
    font-size: calc(1rem + 3px);
}

.font_2up{
    font-size: calc(1rem + 1px);
}

#cms_3-e .box_title3 {
    font-size: 110%;
}
}