﻿@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&display=swap');
/* ----------　all　---------- */
.linkStyle{
	color:#33bfa7;
	text-decoration: underline;
}
.linkStyle:hover{
	color:#33bfa7;
	opacity: 0.7;
	transition: all 0.5s;
}

html{font-size: 17px;}
body{-webkit-text-size-adjust: 120%;font-size: 17px;}

.font_12{font-size: 14px;}
.font_13{font-size: 14px;}
.font_14{font-size: 16px;}
.font_15{font-size: 17px;}
.font_16{font-size: 18px;}
.font_18{font-size: 20px;}
.font_20{font-size: 22px;}
.font_22{font-size: 24px;}
.font_24{font-size: 26px;}
.font_26{font-size: 28px;}
.font_28{font-size: 30px;}
.font_30{font-size: 32px;}
.font_100per{
font-size: -webkit-calc(1rem + 2px);
font-size: calc(1rem + 2px);
}
.font_2up{
font-size: -webkit-calc(1rem + 4px);
font-size: calc(1rem + 4px);
}
.font_4up{
font-size: -webkit-calc(1rem + 6px);
font-size: calc(1rem + 6px);
}
.font_6up{
font-size: -webkit-calc(1rem + 8px);
font-size: calc(1rem + 8px);
}
.font_8up{
font-size: -webkit-calc(1rem + 10px);
font-size: calc(1rem + 10px);
}
.font_10up{
font-size: -webkit-calc(1rem + 12px);
font-size: calc(1rem + 12px);
}
.font_2dw{
font-size: -webkit-calc(1rem);
font-size: calc(1rem);
}

body {
    font-family: 'Zen Kaku Gothic New', sans-serif;
    font-weight: 300;
}

.font_shippori {
    font-family: 'Zen Kaku Gothic New', sans-serif;
    font-weight: 500;
}

p {
    line-height: 2;
}

main {
    background-color: #fcfdfd;
    background-image: url('/Dup/img/bg-ptn.png');
        background-size: contain;
        padding-bottom: 30px;
}

/* nav */

.shop_link {
    width: 200px;
}

.shop_link a p {
    width: 100%;
    text-align: center;
}

#pc_nav {
    z-index: 3;
    background-color: rgba(255,255,255,0.8);
}

.button_container {
    background-color: #56D664;
}

/* footer */

footer .f_btn_box {
    align-items: flex-start;
}

footer .f_btn_box > div {
    width: calc(50% - 20px);
}

footer .f_btn_box p {
    width: 100%;
}

/* ----------　TOP　---------- */

/* main-img */

#main_img:before {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.15);
    z-index: 2;
}

.main-copy {
    width: 60%;
    top: 20%;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 3;
    
}

/* top */

#intro {
        background-image: url(Dup/img/bg.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    background-color: #fcfdfd;
}


#contents_links {
    background-image: url(Dup/img/bg2.jpg);
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: 100%;
        background-color: #fcfdfd;
}

#contents_links .box_wrap .box a::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: rgba(226,236,235,0.5);
    z-index: 2;
}

#contents_links .box_wrap .box .posi_center {
    z-index: 3;
}

#contents_wrap .bg_container {
        padding: 16vh 0;
}

#contents_wrap .con_item {
    width: 100px;
    min-width: 100px;
}

#contents_wrap #contents2 .con_item {
    width: 70px;
    min-width: 70px;
}

#contents_wrap .tab_content .box.active .con_txt p {
    line-height: 2.5;
}

#contents_links .box_wrap .box a:first-of-type::after{
    background-position: center right;
}

/* top-cms */

#top_cms1 {
        background-color: #fcfdfd;
}

#top_cms1 .top_cms_title p, #top_cms2 .top_cms_title p {
        opacity: 0.75;
}



/* ----------　下層ページ　---------- */


/* 会社情報 */
/* お問い合わせ */
/* プライバシーポリシー */
/* サイトマップ */


/*-------------------------------------------------------
			          タブレット
-------------------------------------------------------*/
@media screen and (max-width: 768px){
    
.font_12_tb{font-size: 14px;}
.font_14_tb{font-size: 16px;}
.font_16_tb{font-size: 18px;}
.font_18_tb{font-size: 20px;}
.font_20_tb{font-size: 22px;}
.font_22_tb{font-size: 24px;}
.font_24_tb{font-size: 26px;}
.font_26_tb{font-size: 28px;}
.font_28_tb{font-size: 30px;}
.font_30_tb{font-size: 32px;}
.font_100per_tb{
font-size: -webkit-calc(1rem + 2px);
font-size: calc(1rem + 2px);
}
.font_2up_tb{
font-size: -webkit-calc(1rem + 4px);
font-size: calc(1rem + 4px);
}
.font_4up_tb{
font-size: -webkit-calc(1rem + 6px);
font-size: calc(1rem + 6px);
}
.font_6up_tb{
font-size: -webkit-calc(1rem + 8px);
font-size: calc(1rem + 8px);
}
.font_8up_tb{
font-size: -webkit-calc(1rem + 10px);
font-size: calc(1rem + 10px);
}
.font_10up_tb{
font-size: -webkit-calc(1rem + 12px);
font-size: calc(1rem + 12px);
}
.font_2dw_tb{
font-size: -webkit-calc(1rem);
font-size: calc(1rem);
}
    
.main-copy {
    width: 70%;
    top: 20%;
}
    
#intro {
    background-size: 125%;
}

#contents_links {
    background-size: 125%;
}

footer .f_btn_box {
    align-items: flex-start;
}

footer .f_btn_box > div {
    width: 100%;
    margin-bottom: 15px;
}

footer .f_btn_box p {
    width: 100%;
}
    

}

/*-------------------------------------------------------
		            	スマホ
-------------------------------------------------------*/
@media screen and (max-width: 667px){
    
html{font-size: 15px;}
body{-webkit-text-size-adjust: 110%;font-size: 15px;}

.font_12_sp{font-size: 13px;}
.font_14_sp{font-size: 15px;}
.font_16_sp{font-size: 17px;}
.font_18_sp{font-size: 19px;}
.font_20_sp{font-size: 21px;}
.font_22_sp{font-size: 23px;}
.font_24_sp{font-size: 25px;}
.font_26_sp{font-size: 27px;}
.font_28_sp{font-size: 29px;}
.font_30_sp{font-size: 31px;}
.font_100per_sp{
font-size: -webkit-calc(1rem + 1px);
font-size: calc(1rem + 1px);
}
.font_2up_sp{
font-size: -webkit-calc(1rem + 3px);
font-size: calc(1rem + 3px);
}
.font_4up_sp{
font-size: -webkit-calc(1rem + 5px);
font-size: calc(1rem + 5px);
}
.font_6up_sp{
font-size: -webkit-calc(1rem + 7px);
font-size: calc(1rem + 7px);
}
.font_8up_sp{
font-size: -webkit-calc(1rem + 9px);
font-size: calc(1rem + 9px);
}
.font_10up_sp{
font-size: -webkit-calc(1rem + 11px);
font-size: calc(1rem + 11px);
}
.font_2dw_sp{
font-size: -webkit-calc(1rem - 1px);
font-size: calc(1rem - 1px);
}
    
.overlay .menu_box {
    background-color: rgba(255,255,255,0.95);
}
    
.main-copy {
    width: 80%;
}
    
#contents_wrap .tab_content .box .con_txt .title_wrap {
    padding-top: 0;
}

#header #logo {
    width: 40%!important;
}

.overlay .menu_box {
    padding-left: 20px;
    padding-right: 20px;
}

#nav_menu {
    width: 60%!important;
}

.menu_box .tel_bt a {
    font-size: 14px;
}

.menu_box .tel_bt a span {
    font-size: 16px;
}

.shop_link {
    width: 140px;
}

.shop_link a p {
    font-size: 10px!important;
}
    
}