﻿@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600&display=swap');

#page3 #cms_6-b .cate_box{
        border-top: 1px solid #cccccc;
}

.v_type3 .cate_box{border: 1px solid #cccccc;}
.v_type3 .box_title1{color: #3e9723;}


.liana {
    font-family: 'Dancing Script', cursive;
}

body {
    font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
}

#contents_wrap .con_box.box2{
    margin-top: -150px;
}

.blur {
    background: rgba(255,255,255,0.85) !important;
}

h3.con_title{
        filter: drop-shadow(2px 1px 0px black);
}

#main_img:before {
    background-image: url(./Dup/img/kao.png), url(./Dup/img/fude.png), url(./Dup/img/waku.png);
    background-position: bottom center, center left, center;
    background-repeat: no-repeat;
    z-index: 1;
    background-size: contain, contain, cover;
}

#main_img:after{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    background-image: url(./Dup/img/copy.png);
    background-position: 93% 50%;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 50px;
    pointer-events: none;
    z-index: 2;
}

body::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
 
body::-webkit-scrollbar-track {
   background: linear-gradient(#4c4c4c,#4c4c4c);
}
 
body::-webkit-scrollbar-thumb {
  background: #d6df5c;
  border-radius:5px;
}

.top_title{
    height: 150px;
    margin-top: -50px;
    z-index: 0;
    mix-blend-mode: color;
    transform: translateX(-13%);
}

.top_title:before{
    
}

.top_title2 h2{
	font-size: 100px;
	top: 100px;
}
.top_title2 h2 > span{
	padding-top: 100px;
    display: block;
        z-index: 1;
}
.top_title2 h2 > span:before{
	content: "";
	display: block;
	background-color: #fff; 
	width: 5px;
	height: 100px;
	position: absolute;
	top: 0;
}

/* top_title left */
.top_title2 h2.left{left: 60px;}
.top_title2 .left > span:before{left: 30px;}
/* top_title right */
.top_title2 h2.right {
    right: 60px;
    color: #8ac478;
}
.top_title2 .right > span:before{right: 40px;}

.top_title2 .rotate_txt span{
	transform: rotate(90deg);
	display: block;
	line-height: 0.8;
}

h2.rotate_txt span{
    color: #8ac478;
}


header.scr_header {
    background-color: rgba(255,255,255,0.05);
}

.border_color3, .hvr_border_color3:hover {
    border-color: #838383;
}

.catch{
    text-align: center;
    padding: 0% 20% 0;
    background: rgba(255,255,255,0.95) !important;
    backdrop-filter: blur( 10px );
    -webkit-backdrop-filter: blur( 10px );
    background-image: url(./Dup/img/back.jpg);
    position: relative;
    z-index: 1;
    /* transform: rotate(-5deg);*/
}

.catch h2{
    position: relative;
    display: inline-block;
}

.catch:before{
        content: "";
    display: block;
    width: 30%;
    height: 500px;
    position: absolute;
    top: 50%;
    left: 60%;
    /* border: 1px solid gray; */
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%) rotate(-1deg);
    pointer-events: none;
    z-index: 1;
    /* background-color: white; */
    background-image: url(./Dup/img/maru2.png);
    background-position: center right;
    background-repeat: no-repeat;
    background-size: contain;
}

h2.con_title {
    font-size: 70px;
font-size: 6vw;transform: rotate(-5deg);}
h2.con_title {
    filter: drop-shadow(2px 1px 0px black);
z-index: 2;
    /*color: white;*/
        color: #1f2f74;
}

#footer_info{
        background-image: url(./Dup/img/back.jpg);
}

.con_box p, .intro_wrap p, p.intro_txt, .box_title1, .box_txt2, .cate_txt1{
    color: black;
}

.more .more_item:before {
    background-color: #00848d !important;
}

.txt_color2, .hvr_txt_color2:hover {
        color: #72bd25;
}

h3.intro_title{
        font-size: 28px;
            font-weight: bold;
}

.bg_color1,.hvr_bg_color1:hover{background-color: #bbce1f;}

.top_cms_box{
        background-color: rgba(230,230,230,0.4);
}

.top_cms_box .cms_title{
    color: black;
}


.txt_color4, .hvr_txt_color4:hover {
    color: #cbab57;
}

.bg_color2, .hvr_bg_color2:hover {
    background-color: #c0d423;
}

.sns_links {
    z-index: 1;
}

header.scr_header {
    background-color: rgba(255,255,255,0.5) !important;
    /*backdrop-filter: blur(5px);*/
}

#loading {
    background-color: white;
}

.progressbar-text{
    font-family: sans-serif;
    filter: drop-shadow(2px 1px 0px black);
    font-family: 'Dancing Script', cursive !important;
    color: rgba(149, 149, 149, 1) !important;
}

#pc_nav li a, #footer_nav li a {
    filter: invert(1);
}

.kesi{
    backdrop-filter: none !important;
}

.menu-trigger-bar {
    background-color: black;
}

.top_title2 h2 > span:before {
    background-color: #8dc67c;
    width: 3px;
}

#page_title .en {
    color: #8dc67c;
}

#page_title .en:before {
    background-color: #8dc67c;
}

.bg_color4, .hvr_bg_color4:hover {
    background-color: #00848d;
}

.border_color2, .hvr_border_color2:hover {
    border-color: #b3b3b3;
}

.linkStyle{color: #00848d;}

#contents_wrap .con_box.box3{
    position: relative;
}

#contents_wrap .con_box.box3:before{
    content: "";
    display: block;
    width: 400px;
    height: 400px;
    position: absolute;
    top: 0%;
    left: 100%;
    background-image: url(./Dup/img/maru2.png);
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: contain;
    pointer-events: none;
    z-index: 3;
}

.more .more_item:hover .icon-right.after:after {
    color: #00848d;
}

.border_white, .hvr_border_white:hover {
    border-color: #00848d;
}

.info_txt > .txt_white{
    color: black;
}

.page_container, .page_container li a{
    color: black;
}

.pager li a:hover {
    background-color: rgba(0,0,0,0.5) !important;
        color: white;
}

.banner2{
      bottom: 0px;
      left: 0;
      text-align: right;
      z-index: 100;
      max-width: 310px;
}


/* ---------- カスタム ---------- */
@media screen and (max-width: 900px){
#main_img {
    height: 70vw !important;
}

.sm-slider, .sm-slider:after {
    height: 70vw;
    min-height: auto !important;
}

.blur {
    background: rgba(255,255,255,1) !important;
}

}



/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){

}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){

#main_img:after {
    background-size: 36px;
    top: 60%;
}

.catch {
    padding: 5% 0% 5%;
}

h2.con_title {
    font-size: 9vw;
}

h3.intro_title {
    font-size: 16px;
}

#intro_wrap{
    padding-top: 35px;
}

.top_title {
    mix-blend-mode: normal;
    opacity: 0.5;
}

.top_title2{
    display: none;
}

#contents_wrap .con_box.box2 {
    margin-top: 0px;
}

#contents_wrap{
    padding-top: 0;
}

#contents_wrap .con_box.box3:before {
    width: 250px;
    height: 250px;
    top: 10%;
}

}