@charset "utf-8";

@import url("/jutaku/common/css/rn03/fonts2.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;700&display=swap');
/* ****************************************************************************

　目次

-------------------------------------------------------------------------------

　01. モジュール

******************************************************************************* */
body {
	color: #333;
}


/* ==

　01. モジュール

=============================================================================== */
section{
	padding:80px 20px;
}
.section__in{
	position: relative;
	max-width:1240px;
  margin: 0 auto;
	box-sizing: border-box;
}
.section__in--sm{
	max-width:1120px;
}
.bold{
	font-weight:700;
}
.waHeading__tit01,
.waHeading__tit02,
.waHeading__tit03,
.waHeading__tit04{
	font-family: 'Noto Serif JP', serif;
	font-weight:700;
}
.waHeading__tit01{font-size:350%;}/*42px*/
.waHeading__tit02{font-size:300%;}/*36px*/
.waHeading__tit03{font-size:270%;}/*32px*/
.waHeading__tit04{font-size:200%;}/*24px*/
.waHeading__head{
	font-family: 'Noto Serif JP', serif;
	font-size: 150%;
	color: #de6638;
	font-weight: 600;
}

.cols{
	max-width:1116px;
	margin:0 auto;
	padding:0 20px 50px;
  display:flex;
  gap:40px;
}
.col{
  width:calc(50% - 20px);
}
.cols.is-reverse{
  flex-direction:row-reverse;
}
.col__media{
	text-align: center;
}
.col__text{
	line-height:2;
}
.col__end{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}
.waExp__note{
	text-indent:-1em;
	margin-left:1em;
	margin-top:10px;
	font-size:100%;
	color:#666;
}
.waExp__note li{
	margin-top:10px;
	color:#666;
}
/* カタログ */
.waCatalog{
	position: relative;
	background:#f5f7f7;
	margin-top:60px;
	padding:0 20px;
	z-index: 1;
}
.waCatalog .section__in{
	position: relative;
	max-width:1080px;
	padding:40px 0 50px;
}
.waCatalog__content{
  width:47%;
}
.waCatalog__visual{
	position: absolute;
	top: clamp(20px, calc(20px + (1080px - 100vw)), 50px);
	right:0;
  width:53%;
}
.waCatalog__text{
  font-size:150%;
  line-height:2;
  margin:10px 0 30px;
}
.waCatalog__btn{
  display:inline-block;
  padding:20px 40px;
  background:#666;
  color:#fff;
  border-radius:40px;
  text-decoration:none;
  font-size:150%;
}

/* Story */
.waStory__note{
	text-indent:-1em;
	margin-left:1em;
	margin-top:10px;
	font-size:100%;
	color:#666;
}
.waStory__note li{
	margin-top:5px;
	color:#666;
}
.waStory__fs{
	font-size:100%;
	color:#666;	
}
/* タブ */
section.waTabs{
	padding:10px 0 0;
}
.waTabs > .section__in{
	position: relative;
	overflow: hidden;
	text-align:center;
	padding:0 20px;
}
.waTabs__nav{
	position: relative;
	display:inline-block;
  background:#eff0f5;
  border-radius:50px;	
  padding:10px;

	}
.waTabs__nav::before{
	position: absolute;
	content: "";
	top: 50%;
	left: 50%;
	transform: translateX(-50%);
	width: calc(100vw - 60px);
	height: 1px;
	background: #999;
	z-index: -1;
}
.waTabs__nav__in{
  display:flex;
  justify-content:center;
  gap:10px;
}
.waTabs__btn{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 16px;
  border:none;
  border-radius:50px;
  background:#fff;
  cursor:pointer;
	font-size:16px;
	min-width:220px;
	font-weight: 500;
	transition: opacity 0.3s ease;
}
.waTabs__btn img{
  width:56px;
  height:56px;
	margin-right:10px;
  border-radius:50%;
  pointer-events: none;
}
.waTabs__btn span{color:#1c7a8c;}
.waTabs__btn.is-active{background:#1c7a8c;}
.waCare .waTabs__btn span{color:#943c84;}
.waCare .waTabs__btn.is-active{background:#943c84;}
.waTabs__btn.is-active span,
.waCare .waTabs__btn.is-active span{color:#fff;}
.waTabs__panel{
  display:none;
  padding:50px 0 0;
	text-align:left;
}
.waTabs__panel.is-active {
	display: block;
}



/* メインビジュアル
------------------------------------------------------------------------------- */
.waVisual01 {
	position: relative;
	background-color: #fff;
	aspect-ratio: 1440 / 600;
	font-size: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 45px;
	overflow: hidden;
}
.waVisual01_img  {
	position: absolute;
}
.waVisual01_img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transform: scale(1.1);
}
.waVisual01_img.inView img {
	opacity: 1;
	transform: scale(1);
}
.waVisual01_img-01 {
	top: 0;
	left: 0;
	width: 71.875%;
	aspect-ratio: 1035 / 290;
	clip-path: polygon(0% 0, 100% 0%, 34.396135% 100%, 0 48.275862%);
}
.waVisual01_img-02 {
	top: 0;
	right: 0;
	width: 50%;
	aspect-ratio: 720 / 300;
	clip-path: polygon(47.2222% 0, 100% 0%, 100% 50%, 50.694444% 100%, 0 48.3333%);
}
.waVisual01_img-03 {
	bottom: 0;
	right: 0;
	width: 71.875%;
	aspect-ratio: 1035 / 440;
	clip-path: polygon(100% 0%, 100% 100%, 0% 100%);
}
.waVisual01_img-04 {
	bottom: 0;
	left: 0;
	width: 50%;
	aspect-ratio: 720 / 451;
	clip-path: polygon(0 0, 100% 67.77777%, 53% 100%, 0% 100%);
}
.waVisual01_tit {
	opacity: 0;
	width: 25.34722%;
}
.waVisual01_tit img {
	width: 100%;
	height: auto;
}




/* 私にとって最高の居場所。
------------------------------------------------------------------------------- */
.waAbout{
	padding:80px 20px;
}
.waAbout .section_in{
	padding-left:50px;
}
.waAbout__ttl{
	font-family: 'Noto Serif JP', serif;
	font-size:350%;
	margin-bottom:50px;
}
.waAbout__lead{
	font-family: 'Noto Serif JP', serif;
	line-height: 2.625;
}
.waAbout img{
	position: absolute;
	top: clamp(0px, calc((1170px - 100vw) * 0.24), 50px);
	right:0;
	width:911px;
	width: clamp(750px, 77.8vw, 911px);
}


/* anchor
------------------------------------------------------------------------------- */
.waAnchor.is-fixed {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
  box-sizing: border-box;
  z-index: 100;
	min-width:960px;
}
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.waAnchor {
	padding: 0 20px 15px;
	background: #f5f7f7;
}
.waAnchor .section__in{
	max-width:1180px;
}
.waAnchor__wrap {
	display: flex;
	gap: 20px;
	overflow-x: auto;
}
.waAnchor__group {
	flex: 0 1 auto;
	min-width: 0;
}
.waAnchor__head {
	font-family: 'Noto Serif JP', serif;
	font-weight: 400;
	font-size: 18px;
	width: 100%;
	padding: 8px 0 5px;
	color: #fff;
	border: none;
	text-align: center;
	cursor: default;
	background: #f5f7f7;
}
.waAnchor__group:nth-child(1) .waAnchor__head { color: #c95a32; }
.waAnchor__group:nth-child(2) .waAnchor__head { color: #2f6f86; }
.waAnchor__group:nth-child(3) .waAnchor__head { color: #7c3a78; }
.waAnchor__items {
	display: flex;
	border-radius: 10px;
	overflow: hidden;
}
.waAnchor__items li {
	flex: 0 1 190px;
	width: 190px;
	min-width: 0;
	border-right: 1px solid #0e495b;
}
.waAnchor__group:nth-child(3) li {
	border-right: 1px solid #59244f;
}
.waAnchor__items li:last-child {
	border-right: 0;
}
.waAnchor__items a {
	font-size: clamp(14px, 1.5vw, 16px);
	position: relative;
	display: block;
	padding: 15px 12px 30px;
	text-align: center;
	text-decoration: none;
	color: #fff;
	transition: opacity 0.3s ease;
}
.waAnchor__group:nth-child(1) a { background: #c95a32; }
.waAnchor__group:nth-child(2) a { background: #2f6f86; }
.waAnchor__group:nth-child(3) a { background: #7c3a78; }
.waAnchor__items a::after {
	position: absolute;
	content: "";
	display: block;
	width: 6px;
	height: 6px;
	margin: 6px auto 0;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(45deg);
	left: 50%;
	bottom: 15px;
	transform: translateX(-50%) rotate(45deg);
}
.waAnchor__items a:hover {
	opacity: 0.7;
}



/* 「私の自由区」4つの魅力
------------------------------------------------------------------------------- */
.wacharm .section__in{
	max-width:1045px;
}
.wacharm__list {
  display: flex;
}
.wacharm__item {
  flex: 1;
  padding: 10px 0;
  text-align: center;
  border-right: 1px solid #ccc;
}
.wacharm__item:last-child {
  border-right: none;
}
.wacharm .waHeading__tit02{
	text-align: center;
	margin-bottom:20px;
}
.wacharm__num{
	font-family: 'Noto Serif JP', serif;
	font-size:260%;
	line-height:1;
}
.wacharm__text{
	padding-top:20px;
	font-size:100%;
}


/* Active
------------------------------------------------------------------------------- */
.waActive{
	padding:0;
	position: relative;
	border-left:20px solid #de6638;
}
.waActive::before{
  content:"";
  position:absolute;
  top:0;
  left:-20px;
  width:20px;
  height:100%;
  background: url(../images/active_bg01.png) no-repeat;
  z-index:1;
}
.waActive__top{
	padding:0 20px;
}
.waActive__top .section__in::after{
  content:"";
  position:absolute;
  top:15px;
  left:0;
  width:100%;
  height:100%;
  background: url("../images/active_bg03.png") no-repeat 36% 0;
	background-size:280px auto;
  z-index: 1;
  pointer-events: none; 
}
.waActive__header{
	padding-top:50px;
  position: relative;
  z-index: 2;
}
.waActive__title{
	max-width:331px;
}
.waActive__catch{
  margin-top:16px;
  padding:5px 0;
	max-width:331px;
	font-family: 'Noto Serif JP', serif;
  background:#de6638;
  color:#fff;
  font-size:18px;
	text-align: center;
}
.waActive__visual{
	position: absolute;
	width: 53%;
  max-width: 600px;
	top:50px;
	right:0;
	z-index: 3;
}
.waActive__philosophy{
	position: relative;
	margin:45px 0 50px;
  padding:35px 55px;
  max-width:75%;
  background:#f7f1e8;
	z-index: 0;	
}
.waActive__philosophyHead{
	font-family: 'Noto Serif JP', serif;
  color:#de6638;
	font-weight:700;
  font-size:22px;
  margin-bottom:5px;
}
.waActive__top .waHeading__tit03{
  font-weight:700;
}
.waActive__top .waHeading__head{
	margin-top:40px;
}


.waExp .col__title{
	font-family: 'Noto Serif JP', serif;
	font-size:200%;
	font-weight: 700;
	margin:5px 0 20px;
}
.waExp .cols:first-of-type .col__media {
	max-width:468px;
	margin:0 auto;	
}
.waExp .cols:last-of-type .col__media span {
	display:block;
	font-size: 116.67%;
	margin-top:10px;
	text-align:right;
	color:#666;
}
.waActive .waStory{padding:0 20px;}
.waActive .waStory .section__in{
	max-width:1116px;
	position: relative;
	overflow: hidden;
	padding:40px 40px 230px;
	background: #fcf9f6 url("../images/active_bg02.png") no-repeat -60px -60px;
	background-size: 180px auto;
}
.waActive .waStory .section__in::before{
  content:"";
  position:absolute;
  top:24%;
  left:15%;
  width:100%;
  height:100%;
  background: url("../images/active_bg03.png") no-repeat;
	background-size:351px auto;
}

.waActive .waStory .waHeading__head,
.waActive .waStory .waHeading__tit04,
.waActive .waStory .waStory__name{
	padding-left:105px;
	font-weight:700;
}
.waActive .waStory .waStory__name{margin-top:10px;}
.waActive .waStory__text{
	padding-right:340px;
	margin-top:40px;
	line-height:2;
}
.waActive .waStory__visual{
	position: absolute;
	bottom:40px;
	right:40px;
  max-width:538px;
  display:flex;
  gap:20px;
  align-items:stretch;
  align-self:flex-end;
}
.waActive .waStory__video{
  width:calc(50% - 10px);
}
.waActive .waStory__video img{
  width:100%;
  height:auto;
  display:block;
}
.waActive .waStory__image{
  width:calc(50% - 10px);
  display:flex;
  align-items:flex-end;
}
.waActive .waStory__image img{
  width:100%;
  height:auto;
  display:block;
}


/* Immcrsive
------------------------------------------------------------------------------- */
.waImm{
	padding:50px 0 0 0;
	position: relative;
	border-left:20px solid #177a98;
}
.waImm::before{
  content:"";
  position:absolute;
  top:0;
  left:-20px;
  width:20px;
  height:100%;
	background: url(../images/imm_bg01.png) no-repeat 0 0;
	z-index:1;
}
.waImm__top{
	padding:0 20px;
}
.waImm__top .section__in::after{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background: url("../images/imm_bg03.png") no-repeat 40% 0;
	background-size:325px auto;
  z-index: 1;
  pointer-events: none; 
}
.waImm__header{
	padding-top:50px;
  position: relative;
  z-index: 2;
}
.waImm__title{
	max-width:461px;
}
.waImm__catch{
  margin-top:16px;
  padding:5px 0;
	max-width:370px;
	font-family: 'Noto Serif JP', serif;
  background:#177a98;
  color:#fff;
  font-size:18px;
	text-align: center;
}
.waImm__visual{
	position: absolute;
	width: 49%;
  max-width: 600px;
	top:50px;
	right:0;
	z-index: 3;
}
.waImm__philosophy{
	position: relative;
	margin:45px 0 50px;
  padding:35px 55px;
  max-width:75%;
  background:#e9eff5;
	z-index: 0;	
}
.waImm__philosophyHead{
	font-family: 'Noto Serif JP', serif;
  color:#177a98;
	font-weight:700;
  font-size:22px;
  margin-bottom:5px;
}
.waImm__top .waHeading__tit03{
  font-weight:700;
}
.waImm__top .waHeading__head{
	margin-top:40px;
}
.waImm .waHeading__head{
	color: #177a98;
}
.waImm .waStory{padding:0 20px;}
.waImm .waStory .section__in{
	max-width:1116px;
	position: relative;
	overflow: hidden;
	padding:40px;
	background: #e9eff5 url("../images/imm_bg02.png") no-repeat -10px -100px;
	background-size: 129px auto;
}
.waStory__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: center;
}
.waImm .waStory .waHeading__head,
.waImm .waStory .waHeading__tit04,
.waImm .waStory .waStory__name{
	padding-left:105px;
	font-weight:700;
}
.waImm .waStory .waStory__name{margin-top:10px;}
.waImm .waStory__text{
	margin-top:40px;
	line-height:2;
}

/* Care
------------------------------------------------------------------------------- */
.waCare{
	padding:50px 0 0 0;
	position: relative;
	border-left:20px solid #943c84;
}
.waCare::before{
  content:"";
  position:absolute;
  top:0;
  left:-20px;
  width:20px;
  height:100%;
	background: url(../images/care_bg01.png) no-repeat 0 0;
	z-index:1;
}
.waCare__top{
	padding:0 20px;
}
.waCare__top .section__in::after{
  content:"";
  position:absolute;
  top:40px;
  left:32%;
  width:264px;
  height:429px;
  background: url("../images/care_bg03.png") no-repeat 0 0;
	background-size:264px auto;
  z-index: 1;
}
.waCare__header{
	padding-top:50px;
  position: relative;
  z-index: 2;
}
.waCare__title{
	max-width:398px;
}
.waCare__catch{
  margin-top:16px;
  padding:5px 0;
	max-width:320px;
	font-family: 'Noto Serif JP', serif;
  background:#943c84;
  color:#fff;
  font-size:18px;
	text-align: center;
}
.waCare__visual{
	position: absolute;
	width: 53%;
  max-width: 600px;
	top:130px;
	right:0;
	z-index: 3;
}
.waCare__philosophy{
	position: relative;
	margin:45px 0 50px;
  padding:35px 55px;
  max-width:75%;
  background:#eff0f5;
	z-index: 0;	
}
.waCare__philosophyHead{
	font-family: 'Noto Serif JP', serif;
  color:#943c84;
	font-weight:700;
  font-size:22px;
  margin-bottom:5px;
}
.waCare__top .waHeading__tit03{
  font-weight:700;
}
.waCare__top .waHeading__head{
	margin-top:40px;
}
.waCare .waHeading__head{
	color: #943c84;
}
.waCare .waStory{
	padding:0 20px;
}
.waCare .waStory .section__in{
	max-width:1116px;
	position: relative;
	overflow: hidden;
	padding:40px;
	background: #f4f4f8 url("../images/care_bg02.png") no-repeat -85px -80px;
	background-size: 263px auto;
}
.waCare .waStory__inner {
	display:block;
  position: relative;
	padding-right:370px;
}
.waCare .waStory .waHeading__head,
.waCare .waStory .waHeading__tit04{
	padding-left:105px;
	font-weight:700;
}
.waCare .waStory__text{
	margin-top:40px;
	line-height:2;
}
.waCare .waStory__visual{
	position: absolute;
	top:0;
	right:0;
	max-width:320px;
}
.waCare .waStory__image:first-child {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  align-items: start;
	margin-bottom:50px;
}
.waCare .waStory__image p{font-size:116%;}
.waCare .waStory__image .name{font-size:150%;}
.waCare .waStory__visual .waStory__image:last-child {grid-column: 1 / -1;}


/* 音の自由区
------------------------------------------------------------------------------- */
.waOto .section__in{
	text-align:center;
}
.waOto .waHeading__tit04{
	margin-top:20px;
	font-family: 'Noto Sans Japanese', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS P Gothic", Arial, Helvetica, sans-serif;
}
.waOto .waOto__txt{
	margin:15px 0 20px;
}
.waOto__btn{
	text-align:center;
	padding-top:20px;
}
.waOto__btn a{
	min-width:260px;
  display:inline-block;
  padding:20px 0;
	text-align: center;
  background:#cc3b33;
  color:#fff;
  border-radius:40px;
  text-decoration:none;
  font-size:150%;
	box-sizing: border-box;
}


/* 私の自由区を、詳しく知りたい方へ
------------------------------------------------------------------------------- */
.waCta{
	padding:50px 0 100px;
	background:#f3f4f5;
}
.waCta .waHeading__tit02{
	text-align: center;
	margin-bottom:55px;
}
.waCta .cols{
	max-width:1190px;
}
.waCta .col__text{
	text-align:center;
}
.waCta__btn{
	text-align:center;
	padding-top:20px;
}
.waCta__btn a{
	min-width:260px;
  display:inline-block;
  padding:20px 0;
	text-align: center;
  background:#cc3b33;
  color:#fff;
  border-radius:40px;
  text-decoration:none;
  font-size:150%;
	box-sizing: border-box;
}


/* 自社研究所から生まれる想い
------------------------------------------------------------------------------- */
.kaAbout01 {
	margin: 80px 0 0;
	padding: 84px 30px 80px;
	background: #F5F2EE url(../images/about_bg01.png) center center no-repeat;
	background-size: cover;
}
.kaAbout01_in {
	max-width: 1000px;
	margin: 0 auto;
}
.kaAbout01_tit {
	line-height: 1.2;
	margin: 0 0 64px;
	font-family: 'Noto Serif JP', serif;
	font-size: 250%;
	font-weight: 500;
	text-align: center;
}
.kaAbout01_block {
	display: -webkit-box;
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 40px 0 0;
}
.kaAbout01_block-reverse {
	flex-direction: row-reverse;
}
.kaAbout01_txt {
	line-height: 2;
	margin: 0 0 15px;
	font-size: 134%;
	font-weight: 400;
}
.kaAbout01_img {
	width: 48%;
}
.kaAbout01_info {
	width: 48%;
}