/*-------------------------------------------------------------
 色 ・　文字
---------------------------------------------------------------*/
:root{
    --color1: #BA0001;
    --color2: #f7e8d1;
    --color3: #af8b5a;
    --color4: #fbf8f6;
	--text: #111111;
    --base: #ffffff;
    
    --font1: 16px;
    --fontB1: 32px;
    --font-jp: "Hina Mincho", serif;
}
/* スマホ */
@media screen and (max-width: 667px){
    :root{
        --fontB1: 22px;
    }
}

html,body,.font_10,.font_11,.font_12,.font_13,.font_14,.font_15{font-size: var(--font1);}
.font_2up{font-size: max(calc(var(--font1) + 2px), calc(1rem  + 2px));}
.font_4up{font-size: max(calc(var(--font1) + 4px), calc(1rem  + 4px));}
.font_2dw{font-size: max(calc(var(--font1)), calc(1rem  - 2px));}
.font_4dw{font-size: max(calc(var(--font1)), calc(1rem  - 4px));}
.font_6dw{font-size: max(calc(var(--font1)), calc(1rem  - 6px));}
.nav_tel, .main_page_link_span, .main_img_txt, .main_img_txt2, .contents1_title, .contents1_subtitle, .more_btn, .about_area_title, .contents_no, .contents2_title, .contents3_title, .modal_txt_wrap h2, .top_cms_title, .footer_tel, .footer_mail, #page_title, #page8 #phone a, #page9 h3, #page10 li a{font-family: "Kiwi Maru", serif;}

#top_cms .more_btn:hover,.footer_mail .more_btn:hover{
    background-color: var(--color4)!important;
    opacity: 1;
}

#top_cms .more_btn.btn_2:hover{
    background-color: var(--color2)!important;
}

/* color */
body, .txt_color_nomal, .hvr_txt_color_nomal:hover{color: var(--text);}
.linkStyle{transition: 0.5s;color: var(--text)}
.linkStyle:hover{opacity: 0.7}

.txt_white, .hvr_txt_white:hover{color: white;}
.txt_red, .hvr_txt_red:hover{color: var(--red);}
.txt_color1, .hvr_txt_color1:hover{color: var(--color1)} /* メインカラー */
.txt_color2, .hvr_txt_color2:hover{color: var(--color2)} /* サブカラー */
.txt_color3, .hvr_txt_color3:hover{color: var(--color3)} /* アクセントカラー1 */
.txt_color4, .hvr_txt_color4:hover{color: var(--color4)} /* アクセントカラー2 */

/* background-color */
.bg_white, .hvr_bg_white:hover{background-color: white} /* 白背景 */
.bg_black, .hvr_bg_black:hover{background-color: var(--black)} /* 黒背景 */
.bg_color1, .hvr_bg_color1:hover{background-color: var(--color1)} /* メインカラー */
.bg_color2, .hvr_bg_color2:hover{background-color: var(--color2)} /* サブカラー */
.bg_color3, .hvr_bg_color3:hover{background-color: var(--color3)} /* アクセントカラー1 */
.bg_color4, .hvr_bg_color4:hover{background-color: var(--color4)} /* アクセントカラー2 */
.bg_color_clear, .hvr_bg_color_clear:hover{background-color: transparent!important}


/* border-color ※!important */
.border_white, .hvr_border_white:hover{border-color: white}
.border_black, .hvr_border_black:hover{border-color: var(--black)}
.border_color1, .hvr_border_color1:hover{border-color: var(--color1)}
.border_color2, .hvr_border_color2:hover{border-color: var(--color2)}
.border_color3, .hvr_border_color3:hover{border-color: var(--color3)}
.border_color4, .hvr_border_color4:hover{border-color: var(--color4)}
/*-------------------------------------------------------------
 装飾
---------------------------------------------------------------*/
#top_conveyor .top_cms_item_svg{
    top: auto;
    left: 50px;
    z-index: -1;
    bottom: -200px;
}
.top_cms_item .top_cms_item_svg{
    left: auto;
    right: 40px;
}
.page_content .top_cms_item_svg.svg1{
    top: 380px;
    left: auto;
    right: 10px;
}
.page_content .top_cms_item_svg.svg2{
    top: 750px
}
.page_content .top_cms_item_svg.svg3{
    top: auto;
    bottom: 650px;
    left: auto;
    right: 10px;
}
.page_content .top_cms_item_svg.svg4{
    top: auto;
    bottom: 40%;
        left: auto;
    right: 10px;
}

/* タブレット */
@media screen and (max-width: 768px){
    .top_cms_item_svg{width: 230px;}
    #top_conveyor .top_cms_item_svg{left: 0px;bottom: -160px;}
    .page_content .top_cms_item_svg.svg1{    top: 310px;}
    .page_content .top_cms_item_svg.svg4{display: none;}
}
/* スマホ */
@media screen and (max-width: 667px){
    .top_cms_item_svg{width: 150px;}
    #top_conveyor .top_cms_item_svg{bottom: -110px;}
    .top_cms_item .top_cms_item_svg{top: 60px;right: 10px;}
    .page_content .top_cms_item_svg.svg1{top: 210px;}
    .page_content .top_cms_item_svg.svg2{top: 320px;}
    .page_content .top_cms_item_svg.svg3{bottom: 780px;}
}
/*-------------------------------------------------------------
 top, all
---------------------------------------------------------------*/
/*#menu_bt{    transform: translateX(80px);}*/
.sub_page .main_header{
    background-color: var(--color1);
}
.contents2_title,.contents3_title{
    color: var(--color1);
}

.footer_item{
    background-color: var(--color2);
}
.modal_wrap h2{
    color: var(--color1);
}

#contents1{
    margin: 80px auto;
}

#page_title::before{
    background: rgba(255,255,255,0.6);
}
#page_title .title_box.txt_white{
    color: var(--color3);
    text-shadow: 0 0 5px #fff,0 0 15px #fff;
}
#page_title .page_title_inner{background-position-y: 30%;}


.footer_item > div {padding: 0px;}
#logo2,.footer_item_con{
    padding: 20px 10%;
}
#logo2{
    background-color: var(--color1);
    max-width: 100%!important;
}
#logo2 a img{
    margin: 0 auto;
    max-width: 300px;
}
#logo2 a {
    width: 100%;
    text-align: center;
    display: block;
}

.f_atte{
    align-items: center;
    padding: 15px 3%;
    background-color: rgba(255,255,255,0.4);
    border-radius: 15px;
    margin-bottom: 10px;
}
.f_atte .icon_a{
    display: block;
    width: 25px;
    margin-right: 10px;
        transform: translateY(-3px);
}
.f_atte .ate_text{
    display: block;
    width: calc(100% - 35px);
    font-size: 0.9rem;
    line-height: 1.5;
    font-weight: bold;
    color: var(--color1);
}

.f_atte .ate_text .hilight{
    background: linear-gradient(transparent 70%, #e3c291 70%);
}

/* タブレット */
@media screen and (max-width: 768px){
    #cms_3-c .cate:last-child{
        padding-bottom: 0;
        margin-bottom: 0;
    }
    
    #cms_1-g .cate_box,#cms_2-f .cate:last-child,#cms_2-g .cate:last-child{
        margin-bottom: 30px;
    }
    #cms_1-g .pager{
        margin-bottom: 0px;
    }
    #phone{
        margin-bottom: 0px;
    }
    .f_atte .icon_a{
        margin: 0 0 10px;
    }
    .f_atte .ate_text{
        width: 100%;
        text-align: center;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    .contents1_title{
       width: 250px;
        margin: 0 auto 20px;
    }
    #page_title .title_box{
        min-width: 300px!important;
    }
    #page_title .title_box h2{
        letter-spacing: 0em;
    }
}

/*-------------------------------------------------------------
 logo
---------------------------------------------------------------*/


.sub_page #menu_bt{
    top: 7px;
}
#logo2{
    max-width: 650px;
}
.sub_page .main_header h1{
    max-width: 180px;
}
.index .main_header{
    position: absolute;
    top: 0;
}
.index .main_header h1{
    max-width: calc(20vw - 30px);
    position: absolute;
    z-index: 10;
    top: 15px;
    left: 15px;
    background-color: var(--color1);
    padding: 15px;
}
/* タブレット */
@media screen and (max-width: 768px){
    .index .main_header h1{
        max-width: 250px;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    .sub_page .main_header{
        padding: 10px 10px;
    }
    .sub_page .main_header h1{
            max-width: 45%;
    }
    .index .main_header h1{
        padding: 0px;
        max-width: 40vw;
        position: absolute;
        z-index: 10;
        top: 21px;
    }
    #logo2 a img{
        max-width: 200px;
    }
}

/*-------------------------------------------------------------
 cms1
---------------------------------------------------------------*/
.topcms_news_type4 .cate_box:hover{
    transform: translate(0px, -10px);
}
.topcms_news_type4 .cate_box{
    transition: all 0.5s;
	width: 30.33333%!important;
	margin-right: 1.5%;
	margin-left: 1.5%;
	border-radius: 15px;
	/*background-color: var(--color2);*/
	padding: 0;
	box-sizing:border-box;
}
.topcms_news_type4 .cate_box .box_img1{
    border-radius: 15px;

}
.topcms_news_type4 .txt_height{
	height: 3em
}
.topcms_news_type4 .box_title1:empty{
	display: block!important;
}
/* タブレット */
@media screen and (max-width: 768px){
}
/* スマートフォン */
@media screen and (max-width: 667px){
.topcms_news_type4 .cate_box {
    width: 100%!important;
    margin-bottom: 15px;
}
}
/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}
/*-------------------------------------------------------------
 cms2
---------------------------------------------------------------*/

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}
/*-------------------------------------------------------------
 cms3
---------------------------------------------------------------*/

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}
/*-------------------------------------------------------------
 cms4
---------------------------------------------------------------*/
.qa_type4 .cate_box{
	background-color: var(--color4);
}
.qa_type4 .box_title1{
	cursor: pointer;
	letter-spacing: 0.5px;
	padding: 12px 36px 12px 50px;
	background-image: url(./Dup/img/faq_q.png);
	background-position: 10px 10px;
	background-repeat: no-repeat;
	background-size: 32px 32px;
}
.qa_type4 .box_title1:after{
	font-size: 20px;
	font-weight: bold;
	position: absolute;
	top: 5px;
	right: 10px;
	content: '\2b';
	display: inline-block;
	-webkit-transition: transform 0.4s;
	transition: transform 0.4s;
}
.qa_type4 .box_title1.open:after{
	-webkit-transform: rotateZ(45deg);
	transform: rotateZ(45deg);
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}
.qa_type4 .box_txt1 p{
	background-image: url(./Dup/img/faq_a.png);
	background-position: 6px 10px;
	background-repeat: no-repeat;
	background-size: 28px 28px;
	padding: 10px 10px 10px 40px;
	    background-color: transparent;
    border-top: 1px solid var(--color3);
}
.qa_type4 .box_title1:empty{
	height: 24px;
}



#cms_2-f #cate0 .box_title1{}
#cms_2-f #cate0 .box_title1::after{
        background-image: url(./Dup/img/faq_q.png);
    background-repeat: no-repeat;
    background-size: 32px 32px;
    width: 32px;
    height: 32px;
    top: calc(50% - 7px);
    background-color: transparent;
    transform: translateY(-50%);
}
#cms_2-f #cate0 .box_txt1{
    position: relative;
    padding-left: 54px;
}
#cms_2-f #cate0 .box_txt1::after{
    content: '';
    position: absolute;
    display: inline-block;
    background-image: url(./Dup/img/faq_a.png);
    background-repeat: no-repeat;
    background-size: 32px 32px;
    width: 32px;
    height: 32px;
    left: 0;
    top: 0px;
    background-color: transparent;
}

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){
    #cms_2-f .box_item{
        padding: 0;
    }
    #cms_2-f #cate0 .box_title1,#cms_2-f #cate0 .box_txt1{padding-left: 45px;}
}
/*-------------------------------------------------------------
 cms5
---------------------------------------------------------------*/

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}
/*-------------------------------------------------------------
 プライバシーポリシー
---------------------------------------------------------------*/



/*-------------------------------------------------------------
 お問い合わせ
---------------------------------------------------------------*/
.con_btn_box .tel_box{
    width: 48%;
        max-width: 420px;
}
.atte {
    background-color: var(--color2);
    padding: 20px 5%;
    border-radius: 15px;
}
.atte .icon_a{
    width: 35px;
    margin-right: 10px;
}
.atte .ate_text{
    color: var(--color1);
    font-size: 1rem;
    line-height: 1.5;
    font-weight: bold;
}

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){
    .con_btn_box .tel_box{
        width: 100%;
    }
    .atte .icon_a{
        margin: 0 0 10px;
    }
    .atte .ate_text{
        text-align: center;
    }
}

/* -------------------------------------------------------------
 リンクボタン 
--------------------------------------------------------------*/
.linkStyle,a{
	color: var(--color1);
	text-decoration: underline;
	transition: all 0.5s;
}
a{
    text-decoration: none;
}
.linkStyle:hover,a:hover{
	opacity: 0.7;
	text-decoration: none;
}

#page10 ul li a{}
#page10 ul li a:hover{
    opacity: 0.3;
}

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}

/* -------------------------------------------------------------
 メインイメージ 
--------------------------------------------------------------*/
.catch {
    z-index: 3;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);/* X横 Y縦 始点が要素の中心になる */
    width: 60%;
}
.main_img::before{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    /*background-color: rgba(255,255,255,0.2);*/
    /*backdrop-filter: brightness(1.1);*/
}

#menu_bt {
    top: 25px;
    right: 25px;
}
.index .main_header{
    width: 100%;
    min-width: 100%;
}
.main_img{
    width: 100%;
    max-width: 100%;
    /*background-image: url(./Dup/img/main_img.png);*/
    height: calc(100vw * 0.56)!important;
    min-height: calc(100vw * 0.56)!important;
    position: relative;
}
.main_img #video,.main_img #video .video{
    height: calc(100vw * 0.56)!important;
    min-height: calc(100vw * 0.56)!important;
}
.main_img #video .video{scale: 1.007;}

.catch {
animation-name: fadeOutAnime;
animation-duration:1s; /* アニメーション時間 */
animation-delay: 3.5s; /* 〇秒後に変化 */
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeOutAnime{
  0% {
    opacity: 0;
    filter: blur(10px);
    /*transform: scale(1);*/
  }

  100% {
    opacity: 1;
    filter: blur(0.00px);
    /*transform: scale(1.02);*/
  }
}

/* タブレット */
@media screen and (max-width: 768px){
    .main_img{
        height: calc(100vw * 0.56);
        min-height: calc(100vw * 0.56);
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    .main_img{
        margin-top: 80px;
        background-image: url(./Dup/img/main_img_sp.png);
        height: calc(100vw * 1.6);
        min-height: calc(100vw * 1.6);
    }
    .index .main_header{
        background-color: var(--color1);
        height: 80px;
    }
}

/* ---------- loopSlider ---------- */
.loopSliderWrap{
    top: 0;
    left: 0;
    height: 450px;
}
.loopSlider {
    margin: 0 auto;
    height: 450px;
    text-align: left;
    position: relative;
    overflow: hidden;
}
.loopSlider .ul {
    height:450px;
    float: left;
    overflow: hidden;
}
.loopSlider .ul .li {
    width: 450px;
    height: 450px;
    float: left;
    display: inline;
    overflow: hidden;
	position: relative;
	box-sizing: border-box;
	padding: 0;
}
.loopSlider .ul .li img{
    border-radius: 0;
}
.loopSliderWrap:after {
    content: "";
    display: none;
    clear: none;
}

@media screen and (max-width: 768px){
#top_conveyor,.loopSliderWrap,.loopSlider,.loopSlider .ul,.loopSlider .ul .li{
	height: 280px;
}
.loopSlider .ul .li{
    width: 280px;
}
#top_conveyor {
    padding-bottom: 0;
    padding-top: 0;
}
}
@media screen and (max-width: 667px){
#top_conveyor,.loopSliderWrap,.loopSlider,.loopSlider .ul,.loopSlider .ul .li{
	height: 179px!important;
}
.loopSlider .ul .li{
    width: 179px;
}
}