@import url('https://fonts.googleapis.com/css2?family=Kiwi+Maru:wght@300;400&display=swap');
.font1,.menu li a,.cms_title,.other_link .posi_center,.page_title_box{
    font-family: 'Kiwi Maru',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", serif;
}

.linkStyle{
    color:#9a6627;
    text-decoration:underline;
}
.linkStyle:hover{
    transition:all 0.3s;
    opacity:0.7;
}

/*--all page---------------------------
-------------------------------------*/
#loading_logo{max-width: 250px;}
#body{overflow:hidden;}
#wrap {
    width: 100%;
    margin: auto;
    margin-top: 0;
}
.menu{background-color: #f6f5ee;}


/*--top page---------------------------
-------------------------------------*/
.top_nav{display:none;}
.main_wrap{margin-top:100vh;}
.main_wrap::before,.main_wrap::after{
    content: '';
    position: absolute;
    display: block;
    z-index: 1;
    top: -65px;
    background-repeat: no-repeat;
    background-size: contain;
    width: 15vw;
    height: 21vh;
}
.main_wrap::before{
    background-image:url(./Dup/img/reaf1.png);
    left:0;
}
.main_wrap::after{
    background-image:url(./Dup/img/reaf2.png);
    right:0;
}
.main_img_wrap{width:100%;}
.main_img::before{
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 50vw;
    height: 65vh;
    background-image: url(./Dup/img/catch.png);
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
    filter: drop-shadow(2px 2px 4px rgba(0,0,0,0.2));
}
.svg_box{display:none!important;}
#contents{
    padding: 5%;
    background-image: url(./Dup/img/reaf3.png),url(./Dup/img/reaf4.png);
    background-repeat: no-repeat,no-repeat;
    background-position: right 3% top 30%,left 2% top 65%;
    background-size: 8%,8%;
}
.welcome img{width:170px;}
.t_cms_img2 .img-container:before {
    background: #74bf9c;
}
.t_cms_txt3,.t_cms_txt6,.t_cms_txt9{
    margin-left: 40px;
    margin-top: 10px;
}
.t_cms_txt4,.t_cms_txt7,.t_cms_txt10{margin-left:40px;}
.point01 img,.point02 img{width:185px;}
.con_box1,.con_box2{margin-bottom:150px;}
#top_cms{
    background-image:url(./Dup/img/bg.png);
    background-repeat:repeat;
}
.cms_title{position:relative;}
.cms_title::before{
    content: '';
    position: absolute;
    display: block;
    width: 80px;
    height: 155px;
    background-image: url(./Dup/img/cms_title.png);
    background-repeat: no-repeat;
    background-size: 60%;
    top: -15px;
    left: -60px;
    z-index: -1;
}
.ellipsis{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
    max-height: 20em;
  -webkit-line-clamp: 10;
}

/*top animation*/
.zoomInTrigger{opacity: 0;}
.zoomIn{
  animation-name:zoomInAnime;
  animation-duration:0.5s;
  animation-fill-mode:forwards;
}

@keyframes zoomInAnime{
  from {
  transform: scale(0.6);
  opacity: 0;
  }

  to {
    transform: scale(1);
  opacity: 1;
  }
}

/*--under page---------------------------
-------------------------------------*/
.all_page{
    background-image: url(./Dup/img/bg2.png);
}
.all_page .menu{background-color:#fff;}
.img-container:before{background-color: #d4e9f1;}



/* ---------- responsive ---------- */
@media screen and (max-width: 1000px){
.main_img::before{
    width: 60vw;
    height: 45vh;
}
.main_wrap{padding-top:0;}
#contents{background-size:11%,11%;}
}


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#loading_logo{max-width: 200px;}
.main_img::before {
    width: 75vw;
    height: 36vh;
}
.main_wrap::before, .main_wrap::after{
    width: 20vw;
    height: 12vh;
}
#contents {
    background-size: 16%,14%;
    background-position: right 3% top 30%,left 2% top 67%;
}
#contents .box:nth-child(odd) figure:after{right:50%;}
#contents .box .txt_wrap {
    width: 95%;
    padding-right: 0;
    margin-bottom: 30px;
}
#contents .box figure {
    width: 65%;
}
#top_cms .top_cms_wrap{width: 80%!important;}
.all_header #header {padding-top: 15px!important;}
header .logo {width: 15%;}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#loading_logo{
    max-width: 200px;
    width: 40%;
}
header .logo {
    width: 25%;
}
.main_img::before {
    width: 95vw;
    height: 34vh;
}
.main_wrap::before, .main_wrap::after{
    width: 30vw;
    height: 12vh;
    top: -30px;
}
#contents{
    padding-top:60px;
    background-size: 25%,20%;
    background-position: right 3% top 37%,left 2% top 69%;
}
.t_cms_txt3, .t_cms_txt6, .t_cms_txt9,
.t_cms_txt4, .t_cms_txt7, .t_cms_txt10{
    margin-left:10px;
}
#contents .box figure {width: 90%;}
#contents .box .txt_wrap{margin-bottom:0;}
#top_cms .top_cms_wrap {width: 90%!important;}
.cms_title::before{display:none;}
.fix_tel{
    right: 10px;
    z-index: 99;   
    position:fixed;
}
    
.fix_tel a{
    width: 40px;
    height: 40px;
}
.fix_tel a div i {
    text-align: center;
    top: 0;
    bottom: 0;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 10px;
    line-height: 1.2;
    margin: auto;
    padding-left:0;
}
#page-top{right:10px;}
#page_title .img-container::after {
    background-color: rgba(170,170,170,0.3);}
}

@media screen and (max-width: 500px){
.main_img::before{height:42vh;}
.main_img_wrap .navi{display:none;}
.main_wrap::before, .main_wrap::after{height:15vh;}
}

/* ---------- IEの処理 ---------- */
@media all and (-ms-high-contrast: none){
#contact_tel a{padding-top:35px;}
}