﻿@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400;500&display=swap');


body{color:#804c15;}
/* color-------------------------------------------------------------------- */
.txt_color_nomal {color: #804c15;}
.txt_color1{color: #ff8b14} /* メインカラー */
.txt_color2{color: #f25317} /* サブカラー */
.txt_color3{color: #b86b1a} /* アクセントカラー1 */
.txt_color4{color: #804c15} /* アクセントカラー2 */
/* background-color */
.bg_color1{background-color: #ff8b14} /* メインカラー */
.bg_color2{background-color: #f25317} /* サブカラー */
.bg_color3{background-color: #b86b1a} /* アクセントカラー1 */
.bg_color4{background-color: #ff8b14} /* アクセントカラー2 */
/* border-color ※!important */
.border_color1{border-color: #804c15}
.border_color2{border-color: #ff8b14}
.border_color3{border-color: #b86b1a}
.border_color4{border-color: #ff8b14}
/* hover -------------------------*/
/* color */
.hvr_txt_color1:hover{color: #ff8b14} /* メインカラー */
.hvr_txt_color2:hover{color: #f25317} /* サブカラー */
.hvr_txt_color3:hover{color: #b86b1a} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #804c15} /* アクセントカラー2 */
/* background-color */
.hvr_bg_color1:hover{background-color: #ff8b14} /* メインカラー */
.hvr_bg_color2:hover{background-color: #f25317} /* サブカラー */
.hvr_bg_color3:hover{background-color: #b86b1a} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #ff8b14} /* アクセントカラー2 */
/* border-color ※!important */
.hvr_border_color1:hover{border-color: #804c15}
.hvr_border_color2:hover{border-color: #ff8b14}
.hvr_border_color3:hover{border-color: #b86b1a}
.hvr_border_color4:hover{border-color: #ff8b14}

.button:hover::after { box-shadow: inset 0 0 0 15em rgb(128 76 21) !important;}
.button2:hover { box-shadow: 0 0 20px rgba(128,76,21,0.2) inset;}
.txt_shadow-b { text-shadow: 0 5px 10px rgba(128,76,21,0.3);}
/* color-------------------------------------------------------------------- */
#main_menu ul li a,.contact_bt a, .tel_bt a { color: #fff;}
.contact_bt a, .tel_bt a {
    color: #fff;
    border-color: #fff;}
#main_menu ul li a::before{background-color: #fff;}
.contact_bt a:hover, .tel_bt a:hover {border-color: #804c15;}


.free_bt a { color: #fff;
            background:#804c15;
            border-color:#804c15;
            z-index: 2;
}
.free_bt a:hover {border-color: #804c15;
                  z-index: 0;}
.free_bt_a:hover::after { box-shadow: inset 0 0 0 15em #b86b1a !important;}

/*border-radius----------------------------------------------------------------*/
.normal_img img, .rectangle_img, square_img,.box_wrap, ul.pager li a,section#page10 ul li a { border-radius: 10px;}
ul.cate_list li a,.tel_bt a,.contact_bt a,.more a,.foot_tel_bt a,.free_bt a{border-radius: 50px;}
/*border-radius----------------------------------------------------------------*/


/*memo---------------------------------------------------------------*/
/*sns*/
.link_box .flex_space-between { justify-content: left !important;}
.link_box ul li { margin-right: 15px;
    width: 12% !important;
    height: 33px !important;}
.link_box ul li a img {
    width: auto !important;
    height: 97% !important;}
    
/*cate_list ...*/
ul.cate_list li a {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    padding: 10px;}
/*タブレット*/
@media screen and (max-width: 768px){
/*sns*/
.link_box .flex_space-between {justify-content: center !important;}
.link_box ul li {
        margin: 0 5px;
    width: 10% !important;
    height: 33px !important;}
footer .link_box li {max-width: 33px;}}
/*memo---------------------------------------------------------------*/

/* font---------------------------------------------------------------------*/
.font_14 {font-size: 15px;}
.txt2, .txt4, .txt5, .txt7 {font-weight: 700;}

body{font-family:'Zen Maru Gothic','Zen Kaku Gothic Antique',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;}
.font_en,#main_menu ul li a,h1,h2,h3,h4,h5,h6,#cms_2-c .box_txt1,.cate_title{
    font-family: 'Zen Maru Gothic','Zen Kaku Gothic Antique',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;}
body {font-size: 15px !important;}
.head_box { padding: 0 10px !important;}
/* font---------------------------------------------------------------------*/
.width_1280-max {
    width: 100%;
    max-width: 100%;}

header { box-shadow: 0 0 20px rgba(0,120,243,0.1);}
#main_menu ul li a {font-size: 16px;}
#main_menu ul li a::before{top: 54%;}

#fakeloader .fl {max-width: 300px !important;}

#main_menu ul li a::before{content: none;}
#main_menu ul li a {padding-left: 0px;}
#main_menu ul li a:hover {
    padding-left: 0px;
    transform: translateY(-3px);}

.line {
    display: inline-block;
    background-image: url(dup/img/line.png);
    background-position: left bottom;
    background-repeat: repeat-x;
    background-size: 107px auto;
    padding-bottom: 9px;
    padding-left: 0px;
    padding-right: 0px;
    box-sizing: border-box;
    border: solid 0px;}

/* top---------------------------------------------------------------------*/


div#main_img::after {
    content: '';
    background-image: url(./Dup/img/main_sozai.png);
    background-size: contain;
    position: absolute;
    width: 100%;
    height: 80px;
    z-index: 5;
    top: 0;
    left: -2px;
    background-size: 150px;
    background-repeat: repeat-x;}

div#main_img::before {
    content: '';
    background: url(dup/img/catch.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 799px;
    height: 350px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -60%);
    z-index: 5;
}

body {
    background-color:#fffaf5;
    background-image: url(Dup/img/main_bg.jpg);
    background-size: 420px;
}


/* top---------------------------------------------------------------------*/
div#contents1 .txt2 {
    text-align: center;
    font-size: 30px;
    padding: 20px 0;}

#contents1, #contents2, #contents3 {
    position: relative;
    padding-top: 100px;
    padding-bottom: 100px;
    padding-right: 80px;
    padding-left: 80px;
}

#contents1::before {
    content: '';
    background-size: 300px;
    background-image: url(./Dup/img/renga.png);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    height: 240px;
    width: 330px;
    top: 0;
    left: 0;
    opacity: 0.5;
    z-index: -2;
}

#contents1::after{
    content: '';
    background-size: 300px;
    background-image: url(./Dup/img/renga02.png);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    height: 195px;
    width: 330px;
    bottom: 0;
    right: 0;
    opacity: 0.5;
    z-index: -2;
}
    
    

#contents2::before {
    content: '';
    background-position: top right;
    background-image: url(dup/img/renga03.png);
    width: 300px;
    height: 218px;
    background-size: contain;
    position: absolute;
    left: 0;
    bottom: -20%;
    background-repeat: no-repeat;
    opacity: 0.5;
    z-index: -2;}

#contents3::before {
    background-image: url(Dup/img/con03.png);
    bottom: -80px;
    content: "";
    position: absolute;
    right: 50px;
    background-repeat: no-repeat;
    background-size: contain;
    width: 153px;
    height: 145px;
    opacity: 0.8;
}


.cms_title::before {
    content: "";
    width: 0px;}

#top_cms .cms_title {
    padding-top: 46px;
    text-align: center;
    padding-left: 0;
    position: relative;
    background-image: url(Dup/img/item1.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 87px;
}
    
.flexslider::before {
    content: '';
    background-color: #ffe4ca;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    mix-blend-mode: soft-light;
    opacity: 0.6;}
/* top---------------------------------------------------------------------*/


/*linkStyle*/
a.linkStyle {
    color: #ff8b14;
    transition: 0.5s;}
a.linkStyle:hover { color: #804c15;}
.opacity07 { opacity: 0.9;}

/*pass------------------------------------------------------------*/
input[type="text"] {
    border: solid 2px #ff8b14;
    border-radius: 5px;
    background: #fffdfc;
    padding: 7px 0px;
    margin: 15px 0px;
    width: 270px;
    color: #804c15;
}

div:first-child input:focus {
    outline: none;
    border: 2px solid #804c15 !important;
}

input[type="button"] {
    background: #804c15;
    cursor: pointer;
    border: solid 0px;
    color: #fff;
    padding: 7px 20px 9px;
    border-radius: 5px;
    font-size: 15px;
    font-family: 'Zen Maru Gothic','Zen Kaku Gothic Antique',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
/*pass------------------------------------------------------------*/


/*丸み・やさしさ*/
#cms_6-a .cate_title {
    border-color: #b86b1a !important;
    background-color: #b86b1a !important;
    border-radius: 15px;}

.cms_6-a .cate_wrap,#cms_6-a .box_wrap{
    border-radius: 15px;
    background: #fff;
    border: solid 0;}

#cms_6-a .cate_box {border-bottom: dotted 3px #804c15;}
.cms_6-a .cate_box {border-bottom: dotted 2px #804c15;}
#cms_6-a .cate_box:last-of-type, .cms_6-a .cate_box:last-of-type {border-bottom: none;}
p#contact_tel a, p#contact_mail a { border-radius: 9px;}


/*タブレット*/
@media screen and (max-width: 768px){
    div#sp_nav .letter_2 a,div#sp_nav li .free_tb{ border-radius: 50px;}
    div#sp_nav li .free_tb{ background-color:#b86b1a;
                            color:#fff;}
    section#page10 .grid_4 {width: 50% !important;}
        .link_box ul {
    background: #ff8b14;
    padding: 10px 0;}
.main_box {
    margin-left: 0;
    padding-top: 60px;}
    
div#main_img::before {
    content: '';
    background: url(dup/img/catch.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 550px;
    height: 239px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-55%, -60%);
    z-index: 5;}
div#main_img::after {
    height: 80px;
    background-size: 119px;
    left: 0px;}
#contents1, #contents2, #contents3 {
    position: relative;
    padding-top: 100px;
    padding-bottom: 40px;
    padding-right: 30px;
    padding-left: 30px;}
#contents3::before {
    bottom: -65px;
    right: 50px;
    width: 130px;
    height: 121px;}
#contents1::before {
    height: 200px;
    width: 265px;
    opacity: 0.3;}
#contents1::after {
    height: 170px;
    width: 283px;
    opacity: 0.3;}
div#contents1 .txt2 {
    text-align: center;
    font-size: 26px;
    padding: 20px 0;
}
div#contents1 {padding-top: 40px;}

#contents2::before {
    width: 267px;
    height: 168px;
    opacity: 0.3;}
    
.hamburger__icon.bg_color1 {background: #804c15;}
.hamburger__icon:after, .hamburger__icon:before { background-color: rgb(128, 76, 21);}
.hamburger {top: 11px;}

}


/*スマホ*/
@media screen and (max-width: 667px){
.hamburger {top: 4px;}
.main_box { padding-top: 48px;}
div#main_img::after {
    height: 80px;
    background-size: 54px;}
div#main_img::before {
    content: '';
    background: url(dup/img/catch.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 315px;
    height: 140px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-55%, -60%);
    z-index: 5;}
div#contents1 .txt2 {
    text-align: center;
    font-size: 17px;
    padding: 10px 0;}
.font_14 {font-size: 14px;}
#contents1, #contents2, #contents3 {
    position: relative;
    padding-top: 50px;
    padding-bottom: 10px;
    padding-right: 20px;
    padding-left: 20px;}
div#contents1 {
    padding-top: 60px;
    padding-bottom: 50px;}
#contents1::before {
    height: 165px;
    width: 240px;
    opacity: 0.3;}
#contents1::after {
    height: 138px;
    width: 230px;}
#contents2::before {
    width: 220px;
    height: 138px;
    bottom: -14%;}
#contents3::before {
    bottom: -73px;
    right: 16px;
    width: 78px;
    height: 78px;}
#top_cms .cms_title {
    padding-top: 40px;
    background-size: 80px;}
h2.logo img {
    margin: 0 auto;
    display: block;}

#page_title .page_box::before {
    content: "";
    width: 45px;}
#page_title .page_box {
    position: relative;
    padding-left: 56px;}
section#page10 .grid_4 {width: 100% !important;}
}


/*IE*/
@media all and (-ms-high-contrast: none){
.flexslider::before {  background-color: rgba(255, 228, 202,0.4) !important;}
.pc_box .contact_bt a,.pc_box .tel_bt a,.pc_box .free_bt_a,.foot_tel_bt a{padding: 15px 0 18px !important;}
.more a{padding-top: 7px !important;}
.pager li a {padding: 1px 0 3px !important;}
ul.cate_list li a { padding: 10px 10px 11px !important;}
#cms_6-a .cate_title{padding-bottom: 14px !important;}
#page9 .box p a {padding: 7px 10px 7px !important;}
#page10 ul li a { padding: 14px 0 14px;}

    
}




/*20220322*/
/* YouTube */
.yt{width: 800px;}
.video_cms{
	padding-bottom: 46.9%;
	height: 0;
    border-radius: 10px;
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 667px){
/* YouTube */
.yt{width: 100%;}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
/* YouTube */
.video_cms {padding-bottom: 56.25%;}
}
