@charset "UTF-8";

.l_contents{background: #F9EED2;}
.l_breadcrumb ul{margin-bottom: 54px;}
.area_title h1{text-indent:100%;white-space:nowrap;overflow:hidden;background: url(../img/title_yamata.png) no-repeat;width: 277px;height: 261px;background-size: cover;margin: 0 auto;}

.area_box{margin-bottom: 80px;}
.area_about{padding-top: 28px;padding-right: 30px;padding-left: 30px;}
.area_about .wrapper{position: relative;background: #FFF;-webkit-border-radius: 17.5px;border-radius: 17.5px;padding: 35px 25px 25px;}
.area_about .wrapper h2,
.area_profile .title span,
.area_profile .title h2,
.popup_content h3,
.popup_content p.text{text-indent:100%;white-space:nowrap;overflow:hidden;}
.area_about .wrapper h2{width: 190px;height: 25px;background: url(../img/title_about.png) no-repeat;background-size: cover;position: absolute;left: 12px;top: -12px;}
.area_about .wrapper .text{font-size:1.125rem;font-weight:bold;}

.area_profile .title span{display: block;width: 145px;height: 50px;background: url(../img/bg_link.png) no-repeat center top;background-size: cover;margin: 0 auto 8px;}
.area_profile .title h2{width: 334px;height: 74px;background: url(../img/title_profile.png) no-repeat center bottom;background-size: cover;margin: 0 auto;}

.profile{background: url(../img/bg_proflie.png) no-repeat 50% 100%;background-size: 325px auto;padding-bottom: 100%;padding-top: 14px;padding-bottom: 22.5vh;}
.list_profile{padding-top: 33px;display: flex;justify-content: space-between;max-width: 360px;margin: 0 auto;}
.list_profile li:nth-of-type(2){padding-top: 6px;}
.list_profile li span{display: block;}
.list_profile li span:hover{cursor: pointer;}
.list_profile li:nth-of-type(1) span{width: 124px;}
.list_profile li:nth-of-type(2) span{width: 128px;}

.area_profile{padding-bottom: 45px;}

/* ポップアップ */
.overlay{
  display: flex;justify-content: center; align-items: flex-start;padding-top: 5vh;position: fixed;top: 0; left: 0;width: 100%;height: 100%;
  background: rgb(0 0 0/.6);z-index: 9999;overflow-y: auto;opacity: 0;visibility: hidden;transition: opacity 0.3s ease, visibility 0.3s ease;
}
.overlay.active{opacity: 1;visibility: visible;}
.popup_content{position: relative;max-width: 330px;-webkit-border-radius: 22px;border-radius: 22px;padding: 30px;}
.closebtn{width: 28px;height: 28px;text-indent:100%;white-space:nowrap;overflow:hidden;-webkit-border-radius: 100vh;border-radius: 100vh;border: none;display: flex;-webkit-appearance: none;
    position: absolute;right: 13px;top: 12px;background-color: #FFF;
}
#prof_01 .popup_content{background: #E8A5A3;border: 3.5px solid #EA655D;}
#prof_02 .popup_content{background: #96D69A;border: 3.5px solid #3DAB4A;}

.popup_content h3{background:none 50% 100% no-repeat;height: 29px;background-size: cover;margin: 0 auto;}
.popup_content .text{width: 100%;height: 11vh;background:none 50% 50% no-repeat;background-size: contain;}
.closebtn{background:none 50% 50% no-repeat;-webkit-background-size:12px auto;background-size:12px auto;}

#prof_01 .popup_content h3{width: 148px;background-image: url(../img/ttl_01.png);margin-bottom:35px;}
#prof_02 .popup_content h3{width: 128px;background-image: url(../img/ttl_02.png);margin-bottom:32px;}
#prof_01 .frame{padding: 0 26px;}
#prof_01 .popup_content .text{min-width: 208px;max-width: 415px;background-image: url(../img/text_01.png);}
#prof_02 .popup_content .text{min-width: 167px;max-width: 334px;background-image: url(../img/text_02.png);}
#prof_01 .closebtn{background-image: url(../img/close_01.svg);}
#prof_02 .closebtn{background-image: url(../img/close_02.svg);}


@media screen and (min-width:768px) {
	.area_about{padding-top:56px;}
  .area_about .wrapper h2 {left: 50%;height: 30px;width: 234px;background-size: auto 100%;margin-left: -117px;}
  .area_about .wrapper .text {line-height: 2;padding:0 30px;}
  .area_box {display: flex;justify-content: space-between;max-width: 734px;margin: 0 auto 40px;}
  .list_profile {max-width: 100%;justify-content: center;}
  .list_profile li {margin: 0 20px 20px;}

}

@media screen and (max-width:767px) {
	.area_about .wrapper .text {text-align:center;}
}