﻿/* all page */
/*fonts*/

/* color ---------------------------------------------------------------------------------------------*/
.linkStyle{color: #160a0a;text-decoration: underline;transition: opacity .3s;}
.linkStyle:hover{opacity: 0.7}
.txt_color1, .hvr_txt_color1:hover{color: #FC8C79;}
/*.txt_color2, .hvr_txt_color2:hover{color: #e6e6e6}*/
.txt_color3, .hvr_txt_color3:hover{color: #BF5748;}
.txt_color4, .hvr_txt_color4:hover{color: #f5ebd5;}
.txt_color5 {
    color: #f5ebd5;
}

/* background-color */
.bg_color1, .hvr_bg_color1:hover{background-color: #FC8C79;}
/*.bg_color2, .hvr_bg_color2:hover{background-color: #e6e6e6}*/
.bg_color3, .hvr_bg_color3:hover{background-color: #FFC3AE;}
.bg_color4, .hvr_bg_color4:hover{background-color: #f5ebd5;}
.bg_color5 {
    background-color: #f5ebd5;
}

/* border-color ※!important */
.border_color1, .hvr_border_color1:hover{border-color: #FC8C79;;}
/*.border_color2, .hvr_border_color2:hover{border-color: #e6e6e6}*/
.border_color3, .hvr_border_color3:hover{border-color: #FFC3AE;}
.border_color4, .hvr_border_color4:hover{border-color: #f5ebd5;}


/* top ----------------*/

/* header */
#logo .logo {width: 250px;}

/* main img */
#main_img .main_img_wrap:before {
    background-color: rgba(255,255,255,0.3);
}
/*#main_img .main_logo {*/
/*    background-color: #f1e8d6;*/
/*    height: 100%;*/
/*    width: 15%!important;*/
/*    padding: 20px;*/
/*    display: flex;*/
/*    align-items: center;*/
/*}*/

/* main */

/* intro */
#intro .intro_wrap{
    background-image: url('./Dup/img/usagi.png');
    background-position: bottom 10px right 50px;
    background-repeat: no-repeat;
    background-size: 100px;
}
#intro_bg{
    background-image: url('./Dup/img/intro_bg.png');
    background-position: top left;
    background-size: contain;
}

.marker-animation {
    background-image: -webkit-linear-gradient(left, transparent 50%, rgba(255,195,174,0.7) 50%);
    background-image: -moz-linear-gradient(left, transparent 50%, rgba(255,195,174,0.7) 50%);
    background-image: -ms-linear-gradient(left, transparent 50%, rgba(255,195,174,0.7) 50%);
    background-image: -o-linear-gradient(left, transparent 50%, rgba(255,195,174,0.7) 50%);
    background-image: linear-gradient(left, transparent 50%, rgba(255,195,174,0.7) 50%);
    background-repeat: repeat-x;
    background-size: 200% .8em;
    background-position: 0 .8em;
    transition: background 2s ease;
	display: inline;
}
.marker-animation.active{
    background-position: -100% .8em;
}

/* contents */
.top_cms_box .cms_title{
    position: relative;
}
.top_cms_box .cms_title::before {
    content: "";
    background-image: url('./Dup/img/illust_cet.png');
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 50px;
    width: 100%;
    height: 50px;
    position: absolute;
    top: -60px;
    left: 0;
}
#contents .fadein:nth-of-type(3) .con_box h3 span.border {
    left: 50%;
    transform: translateX(-50%);
}
#contents .fadein:nth-of-type(1) .con_box .con_item1 {
    right: auto;
    left: 1%;
    width: 110px;
    height: 220px;
    bottom: -80px;
    z-index: 2;
}
#contents .fadein:nth-of-type(2) .con_box .con_item2 {
    left: auto;
    right: 1%;
    width: 180px;
    height: 170px;
    bottom: -90px;
    z-index: 2;
}

/* topcms */


/* footer */
#info_title_box .info_title span {color: #BF5748;}
#logo2 {width: 300px;}


/* under page */
.cate_list li a {
    background-color: #ffc3ae;
}
.btn_container a{padding: 8px 30px;}

/* cms1 */

/* cms2 */

/* cms3 */

/* cms4 */

/* cms5 */

/* page7 */

/* page8 */

/* page9 */

/* page10 */


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#intro .intro_wrap {
    background-position: bottom 5px right 10px;
    background-size: 100px;
    padding-bottom: 180px;
}
#contents .fadein:nth-of-type(1) .con_box .con_item1 {
    left: -5%;
    width: 100px;
    bottom: -170px;
    z-index: 0;
}
#contents .fadein:nth-of-type(2) .con_box .con_item2 {
    right: -5%;
    width: 170px;
    bottom: -120px;
    z-index: 0;
}

}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#logo .logo {width: 180px;}
#main_img .main_img_wrap:before {background-color: rgba(255,255,255,0.4);}
#main_img .main_logo{
    display: none;
}
#intro .intro_wrap {
    background-size: 70px;
}
#logo2.logo {width: 300px;}
#page_title #filter_white {background-color: rgba(255,255,255,0.6)!important;}
#page_title h2 span {font-size: 26px;}

}


/*20230130公開後修正*/
#logo .logo {width: 200px;}
.cms_link {
    top: 12%;
    right: 10px;
    z-index: 9;
}
.cms_link_box {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    transition: 0.3s;
}
.cms_link_box:hover {
    -webkit-transform: translateX(-15px);
    -ms-transform: translateX(-15px);
    transform: translateX(-15px);
    transition: transform 0.3s ease,opacity 0.3s ease;
    transition: 0.3s;
}
.cms_link div a {
    padding: 15px 10px;
    padding-right: 50px;
    transition: 0.3s;
}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#logo .logo {width: 180px;}
.cms_link {
    top: 15%;
}

}

/*20230210*/
.foot_banner {
    right: 90px;
    bottom: 10px;
    max-width: 630px;
}
#foot_banner {
    right: auto;
    bottom: auto;
}
#foot_banner1 {
    z-index: 99;
    width: 280px;
    /*right: 90px;*/
    /*bottom: 10px;*/
}
#foot_banner1 a {
    font-size: 16px;
    text-align: center;
    padding: 21px 70px 21px 102px;
    box-sizing: border-box;
    border-radius: 45px;
}
#foot_banner1 .foot_icon {
    width: 63px;
    left: 3px;
    top: 50%;
    transform: translateY(-50%);
}
#copyright {
    padding-bottom: 100px;
}
/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){

}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.foot_banner {
    max-width: 240px;
    right: auto;
    left: 10px;
}
#foot_banner1 a {
    font-size: 16px;
    padding: 18px 18px 18px 56px;
}
#foot_banner1 .foot_icon {
    width: 56px;
}
#copyright {
    padding-bottom: 160px;
}

}

