@charset "utf-8";

/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main{display:block;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none;}table{border-collapse:collapse;border-spacing:0;}img{vertical-align:bottom;}input[type="text"]{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none;border:none;}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:none;border:none;cursor:pointer;background:none;padding:0;}h1,h2,h3,h4,h5,h6{font:inherit;}
/*================================================
 *  一般・共通設定
 ================================================*/
:root {
	--black:#000;
	--white:#FFF;
	--orange:#F7931E;
	--gray:#A1A6AD;
	--darkgray:#6D7387;
	--lightgray:#EBEBEB;
	--line:#06C755;
	--red:#F00;
	--purple:#293356;
}
html {
	font-size:62.5%;
}
body {
	background:var(--white);
	max-width:100%;
	max-height:100vh;
	font-size:1rem;
	color:var(--black);
	line-height:1.5;
	-webkit-text-size-adjust:100%;
	-webkit-touch-callout:none;
	font-family:"メイリオ","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif
}
*, *:before, *:after {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -o-box-sizing:border-box;
    -ms-box-sizing:border-box;
    box-sizing:border-box;
}
a {
	text-decoration:none;
}
.mplus1p {
	font-family:"M PLUS 1 Code", monospace;
	font-optical-sizing:auto;
	font-weight:<weight>;
	font-style:normal;
}
.BIZUDPGothic {
	font-family:"BIZ UDPGothic", monospace;
	font-optical-sizing:auto;
	font-weight:<weight>;
	font-style:normal;
}
.noto-sans-jp {
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: <weight>;
	font-style: normal;
}
#wrapper {
	display:flex;
	flex-direction:column;
	min-height:100%;
	overflow:hidden;
}
@media screen and (min-width:641px) {
#wrapper {
	max-width:960px;
	margin:0 auto;
}
}
/*================================================
 *  本文
 ================================================*/
h2 {
	font-size:2.25rem;
	font-weight:700;
	margin-left:5%;
	margin-right:5%;
}
.main-head {
	background:linear-gradient(180deg, #F7931E 18%, #F7931E99 40%,#FFFFFF 70%,#FFFFFF 100%);
	padding-bottom:5rem;
}
.main-head h1.title {
	padding:1rem 0 2rem;
}
.main-head h1.title img {
	width:100%;
	line-height:0;
}

ul.slide-items {
	width:100%;
	margin:0;
}

ul.slide-items li .box {
	background:linear-gradient(150deg, #FAD2CD 10%, #FCE8E5 40%, #FCEEEC 68%, #FFD8DA 90%);
	width:96%;
	padding:1.4rem 0;
	border-radius:12px;
	filter:drop-shadow(0px 1px 3px rgba(0, 0, 0, .2));
}
ul.slide-items li .box .picture {
	text-align:center;
}
ul.slide-items li .box .picture img {
	width:auto;
	max-width:36%;
	height:auto;
	line-height:0;
	margin:0 auto 0.5rem;
}
ul.slide-items li .box h2.title {
	font-size:3rem;
	color:var(--orange);
	text-align:center;
}
ul.slide-items li .box h2.title span.sub {
	display:block;
	font-size:1.2rem;
	font-weight:500;
}
ul.slide-items li .box .btn {
	text-align:center;
	margin:2.4rem 0 1rem;
}
ul.slide-items li .box .btn a {
	display:inline-block;
	background:var(--white);
	font-size:1.8rem;
	line-height:1;
	color:var(--orange);
	padding:1rem 2rem;
	font-weight:500;
	border-radius:50px;
}
.dots-2 {
}
.dots-2 .slick-dots {
	text-align:center;
}
.dots-2 .slick-dots li {
	display:inline-block;
}
.dots-2 .slick-dots button {
	display: block;
	width: 10px;
	height: 10px;
	margin: 6px;
	font-size: 0;
	padding: 0;
	border: 0;
	outline: none;
	cursor: pointer;
	background: #bcbcbc;
	border-radius: 50%;
}
.dots-2 .slick-dots .slick-active button {
	background: #0a467d;
}

.pop {
	margin:0 auto 2em;
}
.pop-txt {
	font-size:1.5rem;
	color:#6F7376;
	font-weight:400;
	margin-top:0.25rem;
	margin-left:5%;
	margin-bottom:0.5rem;
}
ul.pop-list {
	display:flex;
	width:95%;
	margin-left:5%;
	overflow-x:scroll;
}
ul.pop-list li {
	width:86.86%;
	margin-right:3.39%;
	margin-bottom:1rem;
	flex-shrink:0;
}
ul.pop-list li:last-child {
	margin-right:5%;
}
ul.pop-list li .box {
	position:relative;
}
ul.pop-list li .box img {
	width:100%;
	height:103.14vw;
	line-height:0;
	object-fit:cover;
	border-radius:12px;
}
ul.pop-list li .box span {
	position:absolute;
	content:"";
	display:inline-block;
}
ul.pop-list li .box span img {
	width:80%;
	height:80%;
	border-radius:0;
}
ul.pop-list li .box span.age {
	bottom:14%;
	left:8%;
	font-size:2rem;
	color:var(--white);
	letter-spacing:0.05em;
	font-weight:700;
}
ul.pop-list li .box span.hobby {
	bottom:8%;
	left:8%;
	background:rgba(255,255,255,.3);
	font-size:1.25rem;
	color:var(--white);
	letter-spacing:0.05em;
	padding:0.5rem 0.75rem;
	font-weight:400;
	border-radius:50px;
}
ul.pop-list li .box span.favorite {
	display:inline-flex;
	justify-content:center;
	align-items:center;
	bottom:24%;
	right:10.2%;
	width:11.594vw;
	height:11.594vw
}
ul.pop-list li .box span.icon {
	bottom:8%;
	right:8%;
}
ul.pop-list li .box span.icon a {
	display:inline-flex;
	justify-content:center;
	align-items:center;
	background:var(--white);
	width:15.459vw;
	height:15.459vw;
	text-align:center;
	border-radius:50%;
}
h2.newbie-title {
	position:relative;
	padding-left:2.25rem;
	margin-bottom:0.5rem;
}
h2.newbie-title::before {
	position:absolute;
	content:"";
	top:50%;
	left:0;
	display:inline-block;
	background:url(../images/newbie-icon.png) no-repeat;
	background-size:auto 100%;
	width:2.25rem;
	height:2.25rem;
	transform:translateY(-50%);
}
.newbie {
	width:100%;
	padding-bottom:6rem;
	margin:0 auto;
}
ul.newbie-list {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	width:90%;
	margin:0 auto;
}
ul.newbie-list li {
	width:48.5%;
	margin-bottom:2rem;
}
ul.newbie-list li .box {
	background:var(--white);
	border-radius:12px;
	filter:drop-shadow(0px 2px 2px rgba(0, 0, 0, .3));
}
ul.newbie-list li .box .picture {
	position:relative;
}
ul.newbie-list li .box .picture img {
	width:100%;
	height:54.589vw;
	line-height:0;
	object-fit:cover;
	border-radius:12px 12px 0 0;
}
ul.newbie-list li .box .picture span.age {
	position:absolute;
	content:"";
	bottom:8%;
	left:50%;
	display:inline-block;
	width:100%;
	font-size:1.6rem;
	color:var(--white);
	text-align:center;
	letter-spacing:0.05em;
	font-weight:400;
	transform:translateX(-50%);
}
ul.newbie-list li .box .btn {
	text-align:center;
	padding:1.5rem 0;
}
ul.newbie-list li .box .btn a {
	display:inline-block;
	background:var(--line);
	width:80%;
	font-size:3.623vw;
	line-height:1;
	padding:1.25rem 0;
	color:var(--white);
	border-radius:50px;
}

/*		ピックアップページ		*/
.pickup {
	width:94%;
	padding:2rem 0 5rem;
	margin:0 auto;
}
h2.pickup-title {
	text-align:center;
}
h2.pickup-title span {
	display:inline-block;
	color:var(--red);
	margin-left:0.5rem;
}
.pickup .pickup-box {
	background:var(--orange);
	width:100%;
	height:calc(100vh - 13.8rem);
	margin-top:2.4rem;
	border-radius:24px;
}
.pickup .pickup-box h3.headline {
	font-size:3.382vw;
	text-align:center;
	padding:1rem 0;
	color:var(--white);
	font-weight:500;
}
.pickup .pickup-box ul.slide-items {
	width:calc(100% - 8px);
	padding-bottom:5px;
	margin:0 auto;
}
.pickup .pickup-box ul.slide-items li .box {
	position:relative;
	background:inherit;
	width:100%;
	padding:0;
	border-radius:24px;
}
.pickup .pickup-box ul.slide-items li .box img {
	width:100%;
	height:calc(100vh - 18.4rem);
	line-height:0;
	object-fit:cover;
	border-radius:24px;
}
.pickup .pickup-box ul.slide-items li .box .detail {
	position:absolute;
	content:"";
	bottom:0;
	left:0;
	right:0;
	display:inline-block;
	background:linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7)65%);
	width:100%;
	padding:4.831vw 10%;
	border-radius:0 0 24px 24px;
}


.pickup .pickup-box ul.slide-items li .box .detail .spec {
	font-size:4.589vw;
	color:var(--white);
	font-weight:500;
	margin-bottom:1.932vw;
}
.pickup .pickup-box ul.slide-items li .box .detail .spec span {
	display:inline-block;
	margin-left:1rem;
	font-weight:300;
}

.pickup .pickup-box ul.slide-items li .box .detail .tag {
	display:inline-block;
	background:#FFFFFF66;
	font-size:1.4rem;
	color:var(--white);
	padding:1.932vw 2.899vw;
	font-weight:400;
	border-radius:50px;
	margin-bottom:1.932vw;
}

.pickup .pickup-box ul.slide-items li .box .detail .comment {
	font-size:4.589vw;
	color:var(--white);
	font-weight:400;
}
.pickup .pickup-box ul.slide-items li .box .detail .btn a {
	background:var(--line);
	width:100%;
	font-size:4.831vw;
	color:var(--white);
}
.pickup .pickup-box ul.slide-items li .box .detail .sns-icon {
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	margin:2.4rem 0 1rem;
}
.pickup .pickup-box ul.slide-items li .box .detail .sns-icon>div {
	flex-basis:calc((100% - 12%) / 5);
	max-width:calc((100% - 12%) / 5);
	text-align:center;
}
.pickup .pickup-box ul.slide-items li .box .detail .sns-icon>div a {
	display:block;
	width:80%;
	margin:0 auto;
}
.pickup .pickup-box ul.slide-items li .box .detail .sns-icon>div a img {
	width:100%;
	height:auto;
	line-height:0;
}


.slick-next:before {
	content:"";
	display:inline-block;
	background:url(../images/nextArrow.png) no-repeat;
	background-size:cover;
	width:30px;
	height:30px;
	opacity:1;
}
.slick-prev:before {
	content:"";
	display:inline-block;
	background:url(../images/prevArrow.png) no-repeat;
	background-size:cover;
	width:30px;
	height:30px;
	opacity:1;
}

/*		掲示板で探す		*/
h2.bbs-title {
	margin:1rem 5%;
}
.bbs-txt {
	font-size:1.5rem;
	color:#6F7376;
	line-height:1;
	font-weight:400;
	margin-top:0.25rem;
	margin-left:5%;
	margin-right:5%;
	margin-bottom:2rem;
}
.bbs-search {
	width:90%;
	margin:0 auto 6rem;
}
.bbs-search .box {
	display:flex;
	background:var(--white);
	width:100%;
	margin-bottom:2rem;
	border-radius:12px;
	box-shadow:0px 0px 5px rgba(0, 0, 0, .3);
}
.bbs-search .box .picture {
	position:relative;
	width:45%;
}
.bbs-search .box .picture img {
	width:100%;
	line-height:0;
	border-radius:12px 0  0 12px;
}
.bbs-search .box .picture span {
	position:absolute;
	content:"";
	left:50%;
	display:inline-block;
	color:var(--white);
	transform:translateX(-50%);
}
.bbs-search .box .picture span.name {
	bottom:18%;
	font-size:2rem;
	font-weight:700;
}
.bbs-search .box .picture span.age {
	bottom:5%;
	font-size:1.75rem;
	font-weight:700;
}

.bbs-search .box .bbs-container {
	width:55%;
	padding:1rem;
}
.bbs-search .box .bbs-container .wap {
	width:100%;
	height:calc(100% - 10.386vw);
}
.bbs-search .box .bbs-container .wap .heading {
	display:flex;
	flex-wrap:wrap;
	background:var(--lightgray);
	border-radius:12px;
	margin-bottom:0.5rem;
}
.bbs-search .box .bbs-container .wap .heading .picture {
	width:21.6%;
}
.bbs-search .box .bbs-container .wap .heading h3.title {
	display:flex;
	align-items:center;
	width:calc(100% - 21.6%);
	font-size:3.623vw;
	line-height:1.2;
	color:var(--purple);
	padding:0 2.415vw;
	font-weight:700;
}
.bbs-search .box .bbs-container .wap .txt {
	font-size:1.4rem;
	color:var(--purple);
	font-weight:500;
	margin-bottom:0.5rem;
}
.bbs-search .box .bbs-container .wap .situation {
	position:relative;
	font-size:1.4rem;
	color:var(--gray);
	padding-left:2rem;
	font-weight:500;
}
.bbs-search .box .bbs-container .wap .situation::before {
	position:absolute;
	content:"●";
	top:0;
	left:0;
	color:var(--line);
}


.bbs-search .box .bbs-container .btn {
	text-align:center;
}
.bbs-search .box .bbs-container .btn a {
	display:inline-block;
	background:var(--line);
	width:94%;
	font-size:3.623vw;
	line-height:1;
	padding:3.382vw 0;
	color:var(--white);
	font-weight:500;
	border-radius:50px;
}

/*		プロフィールページ		*/
.profile-head {
	position:relative;
}
.profile-head img {
	width:100%;
	line-height:0;
}
.profile-head .profile-head-box {
	position:absolute;
	content:"";
	bottom:0;
	left:0;
	right:0;
	display:inline-block;
	background:var(--white);
	width:100%;
	height:auto;
	min-height:40px;
	padding:1.5rem 5% 1rem;
	border-radius:20px 20px 0 0;
	z-index:1;
}
.profile-head .profile-head-box .name {
	font-size:2.5rem;
	color:var(--black);
	font-weight:700;
}
.profile-head .profile-head-box .age {
	font-size:1.75rem;
	color:var(--darkgray);
	font-weight:700;
}
.profile .btn {
	text-align:center;
	margin:3rem 0 7rem;
}
.profile .btn a {
	display:inline-block;
	background:var(--line);
	width:80%;
	font-size:2.5rem;
	line-height:1;
	padding:1.5rem 0;
	color:var(--white);
	font-weight:500;
	border-radius:50px;
}
.profile .sns-icon {
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	margin:3rem 0 5rem;
}
.profile .sns-icon>div {
	flex-basis:calc((100% - 12%) / 5);
	max-width:calc((100% - 12%) / 5);
	text-align:center;
}
.profile .sns-icon>div a {
	display:block;
	width:80%;
	margin:0 auto;
}
.profile .sns-icon>div a img {
	width:100%;
	line-height:0;
}
.profile .self-intro, .profile .profile-contents, .profile .profile-hobby {
	width:90%;
	margin:0 auto 5rem;
}
.profile .self-intro h3.heading, .profile .profile-contents h3.heading, .profile .profile-hobby h3.heading, .profile .profile-safety h3.heading {
	font-size:2rem;
	font-weight:500;
	margin-bottom:1.5rem;
}
.profile .self-intro .txt {
	font-size:1.75rem;
	line-height:1.75;
	color:var(--darkgray);
	font-weight:500;
}
ul.profile-list {
}
ul.profile-list li {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	border-bottom:solid 2px var(--lightgray);
}
ul.profile-list li:last-child {
	border-bottom:none;
}
ul.profile-list li .term, ul.profile-list li .description {
	width:auto;
	font-size:4.348vw;
	padding:1rem 0;
	font-weight:400;
}
ul.profile-list li .term {
	text-align:left;
	color:var(--gray);
}
ul.profile-list li .description {
	text-align:right;
	color:var(--black);
}
.tag-list {
	display:flex;
	flex-wrap:wrap;
	margin-bottom:1.5rem;
}
.tag-list:last-child {
	margin-bottom:0;
}
.tag-list h4.title {
	display:block;
	width:100%;
	font-size:1.6rem;
	font-weight:700;
	margin-bottom:1rem;
}
.tag-list span.box {
	display:inline-block;
	background:var(--lightgray);
	font-size:3.865vw;
	line-height:1;
	color:var(--darkgray);
	padding:1.208vw 3.382vw;
	margin-right:1.208vw;
	margin-bottom:2.415vw;
	font-weight:700;
	border-radius:50px;
}
.profile .profile-safety {
	width:90%;
	margin:0 auto 20rem;
}
.profile-safety dl {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}
.profile-safety dl dt {
	width:auto;
	font-size:1.8rem;
	text-align:left;
	color:var(--gray);
	padding:1rem 0;
	font-weight:400;
}
.profile-safety dl dd {
	width:auto;
	font-size:1.8rem;
	text-align:right;
	color:var(--black);
	padding:1rem 0;
	font-weight:400;
}




@media screen and (min-width:641px) {
.main-head h1.title {
	padding:1rem 0 3rem;
}



ul.pop-list {
	display:flex;
	width:90%;
	margin-left:5%;
	margin-right:5%;
	overflow-x:scroll;
}
ul.pop-list li {
	width:588px;
	margin-right:30px;
}
ul.pop-list li:last-child {
	margin-right:0;
}
ul.pop-list li .box img {
    width:588px;
	height:734px;
}
ul.pop-list li .box span.age {
	font-size:3rem;
}
ul.pop-list li .box span.hobby {
	font-size:2rem;
	padding:0.75rem 2rem;
}
ul.pop-list li .box span.icon a {
	width:10rem;
	height:10rem;
}
ul.newbie-list {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	width:90%;
	margin:0 auto;
}
ul.newbie-list li {
	width:415px;
	margin-bottom:2rem;
}
ul.newbie-list li .box .picture img {
	width:415px;
	height:518px;
}
}
/*================================================
 *  フッター
 ================================================*/
footer {
	position:fixed;
	bottom:0;
	left:0;
	right:0;
	background:var(--white);
	width:100%;
	padding:1rem 0 0.5rem;
}
ul.f-nav {
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	width:100%;
}
ul.f-nav li {
	width:20%;
	text-align:center;
}
ul.f-nav li a {
	display:block;
}
ul.f-nav li a img {
	width:3rem;
	height:3rem;
	line-height:0;
	object-fit:cover;
}
ul.f-nav li a span {
	display:block;
	font-size:1rem;
	color:var(--gray);
}

@media screen and (min-width:641px) {
footer {
	max-width:960px;
	margin:0 auto;
}
ul.f-nav li a span {
	font-size:1.25rem;
}
}