@charset "utf-8";
/* ==========================================================================
# 共通設定
========================================================================== */
html {
  font-size: 62.5%; /* 10px */
}
*,
*::before,
*::after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	min-width: inherit;
	color: #441F00;
	font-size: 1.7rem;
	line-height: 1.8;
	font-family:"Kaisei Tokumin", serif,"Noto Sans JP", "Hiragino Sans", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	font-weight:normal;
	margin: 0;
	padding: 0;
}
a {
	color: #441F00;
	text-decoration: none;
}
img {
	max-width: 100%;
	vertical-align: bottom;
}
ul,
ol {
	list-style: none;
}

/* SP・PC 表示切替え
---------------------------------------------------------- */

.is-pc { display: none; }
.is-sp { display: block; }
@media screen and (min-width: 751px){
	.is-pc { display: block; }
	.is-sp { display: none; }
}
/* タグ
---------------------------------------------------------- */
#tag {
	width: 1px;
	height: 1px;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
}



/* 共通設定
========================================================================== */
.container {
	width: 100%;
	margin: 0 auto;
	background-color: #fff;
	box-shadow: 0 0 calc(10 * 100vw / 750) rgba(0,0,0,0.16);
	position: relative;
}
/* h2, h3, p, li, dt, dd, span, a{
	font-family: "Kaisei Tokumin", serif;
	font-weight: 700;
} */

@media screen and (min-width: 751px) {
.container {
	max-width:1200px;
	box-shadow: 0 0 min(calc(10 * 100vw / 1200), 10px) rgba(0,0,0,0.16);
}
}
/* top
========================================================================== */
.top {
	position: relative;
}
.top_mv img {
    height: auto;
}
.logo_text {
	font-family: 'BIZ UDPGothic', sans-serif;
	font-size: calc(18 * 100vw / 750);
	letter-spacing: 0;
	line-height: 1;
	margin-bottom:calc(15 * 100vw / 750); 
	color: #442624;
}
.top_logo{
	display: flex;
	flex-direction: column;
	position: absolute;
	top: 2%;
	left: 2%;
}
.header_logo-link {
	width: calc(310 * 100vw / 750);
	min-width: 140px;
	line-height: 1;
}
.header_logo-images {
	width: 100%;
}

@media screen and (min-width: 751px) {
.top {
	position: relative;
}
.logo_text {
	font-size: min(calc(11 * 100vw / 1200), 11px);
	margin-bottom:min(calc(13 * 100vw / 1200), 13px);
}
.header_logo-link {
	width: min(calc(290 * 100vw / 1200), 290px);
}
}

/* recommend
========================================================================== */
.recommend_inner {
	background: url(../images/other/img_kv_bt_back_s.webp) 0 0 / cover;
}
.recommend_contents .recommend_title {
	font-size: calc(34 * 100vw / 750);
	font-weight: 700;
	line-height: 1.17;
	letter-spacing: 0.07em;
	color: #fff;
	margin-bottom:calc(25 * 100vw / 750);
}
.recommend_contents .recommend_item{
	padding-right: calc(43 * 100vw / 750);
}
.recommend_contents .recommend_item a{
	display:inline-block;
}
/* swiper */
.swiper_wrap {
	position: relative;
	z-index: 0;
	overflow: hidden;
	padding: calc(27 * 100vw / 750) 0 calc(27 * 100vw / 750) calc(32 * 100vw / 750);
}
.swiper_wrap img{
	width: 100%;
    height: auto;
    box-shadow: 0px 0px calc(10 * 100vw / 750) rgb(0 0 0 / 16%);
}
.swiper-wrapper {
    padding-bottom: calc(28 * 100vw / 750);
}
.swiper-pagination-clickable .swiper-pagination-bullet {
    width: calc(15 * 100vw / 750);
    height: calc(15 * 100vw / 750);
}
.swiper-pagination-bullet {
    background: #AEA48D;
    opacity: inherit;
}
.swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: #fff;
}
.swiper-pagination {
    position: static;
	line-height: 1;
}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap,calc(12 * 100vw / 750));
}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: var(--swiper-pagination-bottom,calc(8 * 100vw / 750));
}
.swiper-scrollbar-drag{
    background: #C49393;
}
.swiper-pagination {
    display: block;
}
@media screen and (min-width: 751px){
	.swiper-android .swiper-slide, .swiper-ios .swiper-slide, .swiper-wrapper,.swiper-backface-hidden .swiper-slide{
		transform: none;
	}
	.swiper-slide{
		height: auto;
		flex-shrink: inherit;
	}
	.swiper-wrapper{
		padding-bottom: 0;
	}
	.swiper-pagination {
		display: none;
	}
	.recommend_inner {
		background: #DA5F0F;
	}
	.recommend_contents .recommend_inner {
        background: url(../images/other/img_kv_bt_back.webp) 0 0 / cover;
        display: flex;
        justify-content: start;
        align-items: center;
        padding: min(calc(22 * 100vw / 1200), 22px) 0 min(calc(22 * 100vw / 1200), 22px) min(calc(56 * 100vw / 1200), 56px);
        gap: 0 min(calc(45 * 100vw / 1200), 45px);
	}
	.recommend_contents .recommend_title {
		font-size: min(calc(26 * 100vw / 1200), 26px);
		line-height: 1.5;
		letter-spacing: 0.03em;
		margin: 0;
		text-align: right;
		flex-shrink: 0;
	}
	.recommend_contents .recommend_list {
		display: flex;
		align-items: center;
		width:min(calc(825* 100vw / 1200), 825px);
	}
	.recommend_contents .recommend_item {
		padding-right:min(calc(22* 100vw / 1200), 22px);
	}
	.recommend_contents .recommend_item:last-child{
		margin-right: 0;
	}
	.recommend_contents .recommend_item img {
		transition: transform .3s;
	}
	.recommend_contents .recommend_item:hover img {
		transform: scale(1.1);
	}
}
/* entrance
========================================================================== */
.entrance {
	position: relative;
	margin: calc(100 * 100vw / 750) calc(32 * 100vw / 750);
}
.entrance_text p{
	font-size: calc(33 * 100vw / 750);
	line-height:2;
	letter-spacing: .04em;
	color: #441F00;
	font-weight: 700;
	letter-spacing: 0;
}
.entrance_text p + p {
    margin-top: calc(80 * 100vw / 750);
}

@media screen and (min-width: 751px) {
.entrance {
	max-width: 835px;
	margin:min(calc(108 * 100vw / 1200), 108px) auto;
}
.entrance_text p{
	font-size: min(calc(23 * 100vw / 1200), 23px);
	letter-spacing: 0.1em;
	text-align: center;
}
.entrance_text p + p{
	margin-top: min(calc(35 * 100vw / 1200), 35px);
}
}
/* design_link
========================================================================== */
.design_link{
	/* background:#FEFBED; */
	padding:calc(58 * 100vw / 750) calc(61 * 100vw / 750) calc(90 * 100vw / 750);
	display: flex;
	justify-content: flex-end;
	gap: 0 calc(120 * 100vw / 750);
	position: relative;
	background:url(../images/other/bg_design.webp) 0 0 / cover;
}
.design_title{
	font-weight: 800;
	font-size:calc(54 * 100vw / 750);
	letter-spacing: .05em;
	line-height: 1;
	writing-mode: vertical-rl;
	width: calc(52 * 100vw / 750);
	flex-shrink: 0;
	position: relative;
}
.design_title::after{
    content: "";
    display: block;
    width: calc(308 * 100vw / 750);
    height: calc(230 * 100vw / 750);
    position: absolute;
    left: 41%;
    bottom: -40%;
    transform: translateX(-50%);
    background: url(../images/other/ico_illust.webp) no-repeat center center / contain;
}
.design_link-list{
	display:flex;
	flex-direction: column;
	gap:calc(44 * 100vw / 750) 0;
	padding-top: calc(23 * 100vw / 750);
}
.design_link-list .design_link-item a{
	font-size: calc(38 * 100vw / 750);
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: .1em;
	position: relative;
	display:inline-flex;
	align-items: center;
}
.design_link-list .design_link-item a::before {
    content: "";
    display: block;
    width: calc(30 * 100vw / 750);
    height: calc(30 * 100vw / 750);
    position: relative;
    top: calc(3 * 100vw / 750);
	margin-right: calc(17 * 100vw / 750);
}

.design_link-list .design_link-item.-business a::before {
	background: url(../images/btn/ico_01.webp) no-repeat 0 0 / contain;
}
.design_link-list .design_link-item.-prosperity a::before {
	background: url(../images/btn/ico_02.webp) no-repeat 0 0 / contain;
}
.design_link-list .design_link-item.-health a::before {
	background: url(../images/btn/ico_03.webp) no-repeat 0 0 / contain;
}
.design_link-list .design_link-item.-goodluck a::before {
	background: url(../images/btn/ico_04.webp) no-repeat 0 0 / contain;
}



@media screen and (min-width: 751px){
	.design_link{
		gap:0 min(calc(225 * 100vw / 1200),225px);
		padding:min(calc(70 * 100vw / 1200),70px) min(calc(100 * 100vw / 1200),100px) min(calc(108 * 100vw / 1200),108px);
		position: relative;
		justify-content: center;
	}
	.design_title{
		font-size:min(calc(56 * 100vw / 1200), 56px);
		width: min(calc(56* 100vw / 1200), 56px);
	}
	.design_title::after{
        width: min(calc(392 * 100vw / 1200), 392px);
        height: min(calc(293 * 100vw / 1200), 293px);
        left: 50%;
        bottom: -36%;
	}
	.design_link-list{
		gap:min(calc(67 * 100vw / 1200), 67px) 0;
		padding-top: min(calc(25 * 100vw / 1200), 25px);
	}
	.design_link-list .design_link-item a{
		font-size: min(calc(35 * 100vw / 1200), 35px);
		transition: .3s;
	}
	.design_link-list .design_link-item a::before {
        width: min(calc(30* 100vw / 1200), 30px);
        height: min(calc(30* 100vw / 1200), 30px);
		top: min(calc(3 * 100vw / 1200), 3px);
		margin-right: min(calc(17 * 100vw / 1200), 17px);
	}
	/*hover anime*/
	.design_link-list .design_link-item a:hover{
		color:#CF9B2B;
	}
}
/* design
========================================================================== */
.design{
	padding-bottom: calc(200 * 100vw / 750);
}
.design_inner {
	position: relative;
	padding:calc(160 * 100vw / 750) calc(32 * 100vw / 750) 0;
}
.design_line-title{
	font-weight: 800;
	font-size:calc(60 * 100vw / 750);
	text-align: center;
	line-height: 0.8;
	letter-spacing: .1em;
	margin-bottom: calc(28 * 100vw / 750);
}
.design_line-title::after {
	content: "";
	display: block;
	width: calc(42 * 100vw / 750);
	height: calc(42 * 100vw / 750);
	margin: calc(40 * 100vw / 750) auto 0;
}
#design_business .design_line-title::after {
    background: url(../images/btn/ico_01.webp) no-repeat 0 0 / contain;
}
#design_prosperity .design_line-title::after {
    background: url(../images/btn/ico_02.webp) no-repeat 0 0 / contain;
}
#design_health .design_line-title::after {
    background: url(../images/btn/ico_03.webp) no-repeat 0 0 / contain;
}
#design_goodluck .design_line-title::after {
    background: url(../images/btn/ico_04.webp) no-repeat 0 0 / contain;
}

.design_line{
	margin-bottom:calc(38 * 100vw / 750);
}
.design_line-lead{
	font-size:calc(30 * 100vw / 750);
	letter-spacing: .03em;
	line-height:1.7;
	font-weight: 700;
}

.design_item-title{
	font-size:calc(53 * 100vw / 750);
	letter-spacing: 0.05em;
	line-height:1;
	font-family: "Kaisei Tokumin", serif;
	font-weight: 800;
	color:#E64500;
	margin-bottom:calc(47 * 100vw / 750);
}
.min_title{
	font-size:calc(34 * 100vw / 750);
}

.design_item-title .hang_icon{
	font-size:calc(47 * 100vw / 750);
	margin:0 calc(30 * 100vw / 750);
}
.design_list-cont:not(:last-child){
	margin-bottom:calc(140 * 100vw / 750);
}
.design_list {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	z-index: 1;
	gap: calc(120 * 100vw / 750) 0;
}

.design_item {
	width: calc(510* 100vw / 750);
	text-align: center;
}
.design_item-thumb{
	margin: 0 auto calc(50 * 100vw / 750);
	width: calc(480* 100vw / 750);
}
.design_item-image {
	box-shadow:calc(12 * 100vw / 750) calc(12 * 100vw / 750) calc(32 * 100vw / 750) 0 rgba(0, 0, 0, 24%);
}
.design_item-detail{
	width: calc(510* 100vw / 750);
	height: calc(106* 100vw / 750);
	margin: 0 auto;
}
.design_item-btn {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: calc(40 * 100vw / 750);
	font-weight: 700;
	color: #fff;
	letter-spacing: .1em;
	text-decoration: none;
	border-radius: calc(18* 100vw / 750);
	background-color: #E04700;
	margin: 0 auto;
	box-sizing: border-box;
	transition: opacity .3s;
	height: 100%;
	line-height: calc(106 * 100vw / 750);
	overflow: hidden;
}
.btn-arrow{
    position: relative;
    width: calc(34 * 100vw / 750);
    height: calc(34 * 100vw / 750);
    border-radius: 50%;
    background: #fff;
    right: calc(-9 * 100vw / 750);
    top: calc(2 * 100vw / 750);
}
.btn-arrow::after {
	position: absolute;
	content: "";
	top: 50%;
	left: 38%;
	transform: translateY(-50%);
	width: calc(12 * 100vw / 750);
	height: calc(16 * 100vw / 750);
	clip-path: polygon(100% 50%, 0 0, 0 100%);
	background: #E04700;
}
/* 横向きはがき */
.design_list.-width {
	margin-top: calc(112 * 100vw / 750);
}
.design_item.-width {
	width: calc(685 * 100vw / 750);
}
.design_item.-width .design_item-image {
	height: auto;
}

@media screen and (min-width: 751px) {
.design{
	padding-bottom: min(calc(200 * 100vw / 1200), 200px);
}
.design_inner{
	padding:min(calc(179 * 100vw / 1200), 179px) min(calc(124 * 100vw / 1200), 124px) 0;
}
.design_line {
    margin-bottom:min(calc(70 * 100vw / 1200), 70px);
}
.design_line-title{
    font-size:min(calc(60 * 100vw / 1200), 60px);
	letter-spacing: .05em;
	margin-bottom: min(calc(30 * 100vw / 1200), 30px);
}
.design_line-title::after {
	width: min(calc(34 * 100vw / 1200), 34px);
	height: min(calc(34 * 100vw / 1200), 34px);
	margin-top: min(calc(40 * 100vw / 1200), 40px);
}
.min_title {
    font-size: min(calc(20 * 100vw / 1200), 20px);
}
.design_line-lead {
    font-size:min(calc(22 * 100vw / 1200), 22px);
    letter-spacing: 0.05em;
    line-height: 1.77;
	text-align: center;
}
.design_item{
	width: min(calc(324* 100vw / 1200), 324px);
}
.design_item-thumb{
	width: auto;
	margin-bottom: min(calc(32 * 100vw / 1200), 32px);
}
.design_item-title {
    font-size: min(calc(32 * 100vw / 1200), 32px);
    letter-spacing: 0.1em;
    margin-bottom:min(calc(20 * 100vw / 1200), 20px);
}
.design_item-title .hang_icon {
    font-size: min(calc(26 * 100vw / 1200), 26px);
    margin: 0 min(calc(15 * 100vw / 1200), 15px);
}
.design_list-cont:not(:last-child){
	margin-bottom:min(calc(200 * 100vw / 1200), 200px);
}
.design_list {
	flex-wrap: wrap;
	flex-direction: row;
	gap: min(calc(120 * 100vw / 1200), 120px) min(calc(214 * 100vw / 1200), 214px);
	justify-content:center;
}
.design_item-link {
	display: block;
	transition: transform .3s ease;
}
@media (hover: hover) and (pointer: fine) {
	.design_item-link:hover {
		transform: scale(1.05);
	}
	.design_item-thumb:hover + .design_item-detail .design_item-btn{
		background: #C01600;
	}
	.design_item-thumb:hover + .design_item-detail .btn-arrow::after {
		transition-delay: .1s;
		background: #C01600;
	}
}
.design_item-image {
	box-shadow:min(calc(8 * 100vw / 1200), 8px) min(calc(8 * 100vw / 1200), 8px) min(calc(24 * 100vw / 1200), 24px) 0 rgba(0, 0, 0, 24%);
}
.design_item-detail{
	width: min(calc(280 * 100vw / 1200), 280px);
	height: min(calc(56 * 100vw / 1200), 56px);
}
.design_item-btn {
  font-size: min(calc(22 * 100vw / 1200), 22px);
  border-radius: min(calc(12 * 100vw / 1200), 12px);
}
.btn-arrow{
	width: min(calc(22 * 100vw / 1200), 22px);
	height: min(calc(22 * 100vw / 1200), 22px);
	right: min(calc(-5 * 100vw / 1200), -5px);
	top:0;
}
.btn-arrow::after {
	width: min(calc(8 * 100vw / 1200), 8px);
	height: min(calc(10 * 100vw / 1200), 10px);
}
@media (hover: hover) and (pointer: fine) {
	.design_item-btn:hover {
		background:#C01600;
	}
	.design_item-btn:hover .btn-arrow::after{
		transition-delay: .1s;
		background:#C01600;
	}
	.design_item-thumb:has(+ .design_item-detail){
		transition: .3s;
	}
	.design_item-thumb:has(+ .design_item-detail:hover){
		transform: scale(1.05);
	}
}

/* 横向きはがき */
.design_list.-width {
	margin-top: min(calc(90 * 100vw / 1200), 90px);
	max-width: min(calc(996 * 100vw / 1200), 996px);
	gap: min(calc(90 * 100vw / 1200), 90px) min(calc(64 * 100vw / 1200), 64px);
}
.design_item.-width {
	width: min(calc(466 * 100vw / 1200), 466px);
}
}

/* messeage
========================================================================== */
.messeage{
	background: #FEFBED;
}
.step_item-text  {
    font-family: "BIZ UDPGothic","Noto Sans JP", sans-serif !important;
}
.service_item-text {
    font-family: "BIZ UDPGothic","Noto Sans JP", sans-serif !important;
}

/* service
========================================================================== */
.step{
	background: #FEFBED;
}
.service_item-arrow{
	background: #E4400D;
}
@media screen and (min-width: 751px) {
    @media (hover: hover) and (pointer: fine) {
        .service_item-link:hover {
            opacity:1;
			color: #E04700;
        }
    }
}
/* appeal
========================================================================== */
.feature_title{
	color: #442624;
}

/* design_feature
========================================================================== */
.feature_bottom-btn a,
.feature_btn-arrow::after {
	background: #E4400D;
}

@media screen and (min-width: 751px) {
	.feature_bottom-btn a:hover,
	.feature_bottom-btn a:hover .feature_btn-arrow::after{
		background: #C01600;
		opacity: 1;
	}
	.feature_bottom-btn a:hover::before{
		opacity: 0;
	}
}
/* footer
========================================================================== */
.footer{
	font-family: "BIZ UDPGothic", sans-serif;
}
.feature_bottom-text,.feature_bottom-btn a{
    font-family: "BIZ UDPGothic", sans-serif;
}
.footer_bottom{
	background:#D70C18;
	padding:calc(36*100vw/750) 0;
}
#sns{
	margin-bottom:calc(32*100vw/750); 
}
/*パンくず*/
.bread_list{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom:calc(21*100vw/750);
}
.bread_list li,.bread_list li a{
	color: #fff;
	font-size: calc(24*100vw/750);
	transition: .3s;
	line-height: normal;
}
.bread_list li:hover a{
	text-decoration: underline;
}
.bread_list li:not(:last-child)::after{
	content: ">";
	display: inline-block;
	padding: 0 calc(5*100vw/750);
}
.copyright{
	display: flex;
	align-items: center;
	justify-content: center;
}
.copyright,.copyright a{
	color: #fff;
	font-size: calc(24*100vw/750);
	transition: .3s;
	line-height: normal;
	font-weight: bold;
}
.copyright a:hover{
	text-decoration: underline;
}

@media screen and (min-width: 751px){
	.footer_bottom{
		padding:min(calc(20*100vw/1200),20px) 0;
	}
	#sns{
		margin-bottom:min(calc(24*100vw/1200),24px); 
	}
	/*パンくず*/
	.bread_list{
		margin-bottom:min(calc(12*100vw/1200),12px);
	}
	.bread_list li,.bread_list li a{
		font-size: min(calc(12*100vw/1200),12px);
		letter-spacing: 0.04em;
	}
	.bread_list li:not(:last-child)::after{
		padding: 0 min(calc(5* 100vw / 1200), 5px);
		font-size: min(calc(14*100vw/1200),14px);
	}
	.copyright,.copyright a{
		font-size:min(calc(12*100vw/1200),12px);
		letter-spacing: 0.04em;
	}
}

