@charset "UTF-8";
/* --------------------------------------------------
ikinari
-------------------------------------------------- */

/* --------------------------------------------------

reset

-------------------------------------------------- */
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: inherit;
	font-size: 100%;
}

html {
	line-height: 1;
}

ol,
ul {
	list-style: none;
}

strong {
	font-weight: bold;
}

em {
	font-style: italic;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption,
th,
td {
	text-align: left;
	font-weight: normal;
	vertical-align: middle;
}

q,
blockquote {
	quotes: none;
}

q:before,
q:after,
blockquote:before,
blockquote:after {
	content: "";
	content: none;
}

img,
a {
	vertical-align: top;
	max-width: 100%;
}

a img {
	border: none;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
	display: block;
}

*,
*:before,
*:after {
	box-sizing: border-box;
}

a:focus,
*:focus {
	outline: none !important;
}

/* --------------------------------------------------
clearfix
-------------------------------------------------- */

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	font-size: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-block;
}

/* Hides from IE Mac \*/
* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}

/* End Hack */

/* --------------------------------------------------
fonts
-------------------------------------------------- */



/* --------------------------------------------------
link
-------------------------------------------------- */

a:link {
	color: #003F98;
}

a:visited {
	color: #282828;
	text-decoration: none;
}

a:hover {
	color: #282828;
	text-decoration: none;
}

a:active {
	color: #282828;
	text-decoration: none;
}

a {
	transition: .2s linear;
}

a img {
	transition: opacity .2s ease-out;
}

a:hover img {
	opacity: 0.5;
}

a:focus {
	outline: 1px dotted #ccc;
}

@media screen and (max-width: 800px) {
	a:hover {
		opacity: 1;
	}
}

/* --------------------------------------------------
html
-------------------------------------------------- */

html {
	font-size: 62.5%;
	height: 100%;
}

@media screen and (max-width: 1080px) {
	html {
		font-size: 58.12%;
		/* 1.4rem */
	}
}

@media screen and (max-width: 600px) {
	html {
		font-size: 53.75%;
		/* 1.3rem */
	}
}

@media screen and (max-width: 400px) {
	html {
		font-size: 50%;
		/* 1.2rem */
	}
}

/* --------------------------------------------------
body
-------------------------------------------------- */

body {
	/* font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; */
	font-family: 'Noto Sans JP', "游ゴシック体", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
	font-weight: 500;
	font-size: 1.6rem;
	line-height: 2;
	height: 100%;
	min-height: 100%;
	color: #000000;
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
	position: relative;
}

/* --------------------------------------------------
共通
-------------------------------------------------- */
.inner-m {
	max-width: 1280px;
	margin: 0 auto;
}

@media screen and (max-width: 1280px) {
	.inner-m {
		max-width: 94%;
	}
}

.inner {
	max-width: 1080px;
	margin: 0 auto;
}

@media screen and (max-width: 1080px) {
	.inner {
		max-width: 94%;
	}
}

.pc-only {
	display: block;
}

.sp-only {
	display: none;
}
.pc-txt-center{
	text-align: center;
}

@media screen and (max-width: 840px) {
	.pc-only {
		display: none;
	}

	.sp-only {
		display: block;
	}
	.pc-txt-center{
		text-align: left;
	}
}

.wrapper{
	overflow: hidden;
}

/* --------------------------------------------------
header
-------------------------------------------------- */
/* mv-row */
.mv-row{
	position: relative;
	z-index: 1;
	margin-bottom: 4rem;
}
.mv-row h1{
	position: absolute;
	bottom: 0;
	right: 2%;
}
.mv-row h1:after{
	content: "";
	display: block;
	width: 13.6rem;
	height: 11.3rem;
	background: url(../img/camera.svg) no-repeat center center / contain;
	position: absolute;
	top: -8%;
	right: -5%;
	z-index: 1;
}
.mv-row .mv-copy{
	position: absolute;
	bottom: 11%;
	left: 27%;
	z-index: 0;
}
.mv-row .mv-copy:after{
	content: "";
	display: block;
	width: 21rem;
	height: 38rem;
	background: url(../img/bg_copy_phototrip.svg) no-repeat center center / contain;
	position: absolute;
	top: 0;
	right: -5%;
	z-index: -1;
}



/* point-area */
.point-check-area{
	background: url(../img/bg_point_check.jpg) no-repeat center center / cover;
	clip-path: polygon(0% 8%, 100% 0%, 100% 100%, 0% 95%);
	padding: 8rem 0;
	position: relative;
}

.point-check-area .base-row{
	display: flex;
	justify-content: space-between;
}
.point-check-area .base-row > div:first-child{
	width: 40%;
}
.point-check-area .base-row > div:first-child .ttl{
	max-width: 405px;
	margin-bottom: 2em;
}
.point-check-area .base-row > div:first-child .txt{
	padding: 1em;
}
.point-check-area .base-row > div:last-child{
	width: 50.6%;
}
.point-check-area .base-row .ttl{
	position: relative;
}
.point-check-area .base-row .ttl .bubble{
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}

@media screen and (max-width: 840px){
	.point-check-area .base-row{
		display: block;
	}
	.point-check-area .base-row > div:first-child,
	.point-check-area .base-row > div:last-child{
		width: 100%;
	}
	.point-check-area .base-row > div:first-child .ttl{
		margin: 0 auto;
		width: 48vw;
	}
	.point-check-area .base-row .ttl .bubble{
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
	}
}

/* photogenic-area */
.photogenic-area{
	position: relative;
	padding: 5rem auto 0 auto;
}
.photogenic-area:before{
	content: "";
	display: block;
	position: absolute;
	background: url(../img/bg_photogenic_line.svg)no-repeat center top / contain;
	width: 100%;
	height: 100%;
	min-height: 97rem;
	top: -9.8rem;
	right: -8em;
	z-index: 2;
}

.photogenic-area:after{
	content: "";
	display: block;
	width: 17rem;
	height: 36rem;
	position: absolute;
	right: 5%;
	bottom: -5%;
	background: url(../img/particle02.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
}
.photogenic-area .inner-m{
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
	align-items: flex-end;
	position: relative;

}
.photogenic-area .inner-m:before,
.photogenic-area .inner-m:after{
	content: "";
	display: block;
	position: absolute;
	z-index: 0;
	right: 0;
	top: 10em;
}
.photogenic-area .inner-m:before{
	width: 60%;
	height: 20em;
	background: #EBEDF0;
}
.photogenic-area .inner-m:after{
	width: 23rem;
	height: 23rem;
	background: url(../img/square.svg)no-repeat center top / contain;
	z-index: -1;
	top: 6em;
	right: -7rem;
	transform: rotate(40deg);
}
.photogenic-area .inner-m .ttl{
	margin-bottom: 2.4rem;
}
.photogenic-area .inner-m .ttl span{
	font-size: 2.5rem;
	font-weight: bold;
	display: block;
}
.photogenic-area .inner-m .ttl:before{
	content: "";
	display: block;
	width: 17rem;
	height: 36rem;
	position: absolute;
	left: 10%;
	top: -24rem;
	background: url(../img/particle02.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
	transform: rotate(45deg)scale(-1 ,-1);
}
.photogenic-area .inner-m >div:first-child{
	width: 50%;
	padding: 1em 1em 8em 1em;
	position: relative;
	z-index: 2;
}
.photogenic-area .inner-m >div:last-child{
	width: 45%;
	position: relative;
	z-index: 2;
}
@media screen and (max-width: 840px){
	.photogenic-area .inner-m{
		display: block;
	}
	.photogenic-area .inner-m >div:first-child,
	.photogenic-area .inner-m >div:last-child{
		width: 100%;
	}
}

/* check-block */
.check-block{
	position: relative;
	text-align: center;
	margin-top: -3em;
	bottom: 0;
	z-index: 10;
}
.check-block .arrow{
	width: 30px;
	height: 30px;
	border: 3px solid;
	border-color:  transparent transparent #45B0E5 #45B0E5;
	transform: rotate(-45deg);
	margin: 0 auto;
}
.check-block img{
	margin-top: 1.6rem;
}

/* tab-contents */
.tab-contents >div{
	display: none;
}
.tab-contents >div.active{
	display: block;
	position: relative;
}

.tab-contents .inner-m{
	margin: 5em auto;
}
.tab-contents .popular .address-row{
	background: #FFF4F1;
	border-left: 2px solid #F7C4B9;
}
.tab-contents .unique .address-row{
	background: #EDF7E1;
	border-left: 2px solid #A2CC6F;
}

@media screen and (max-width: 840px){

	.tab-contents .inner-m{
		margin: 2em auto;
	}

	.tab-contents >div.active figure{
		position: relative;
	}
	
}


/* point-area */
.point-area{
	position: relative;
}
.point-area:before{
	content: "";
	display: block;
	width: 31rem;
	height: 31rem;
	position: absolute;
	right: -15rem;
	top: 50%;
	background: url(../img/circle_l.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
}
.point-area .ttl-device{
	margin-top: 8rem;
}
.point-area .ttl-device span{
	color: #fff;
	font-size: 3rem;
	background: #45B0E5;
	margin: 0;
	padding: 0 2.4rem;
	display: inline-block;
	line-height: 1.6;
}
.point-area .point-block {
	display: flex;
	border-top: 2px solid #45B0E5;
	position: relative;
}
.point-area .point-block:first-of-type:before{
	content: "";
	display: block;
	width: 6.4rem;
	height: 16rem;
	position: absolute;
	right: 0;
	top: -5%;
	background: url(../img/particle03.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
}
.point-area .point-block:nth-of-type(2):before{
	content: "";
	display: block;
	width: 10.4rem;
	height: 20rem;
	position: absolute;
	left: -5%;
	bottom: -10%;
	background: url(../img/particle03.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
}
.point-area .point-block:nth-of-type(2):after{
	content: "";
	display: block;
	width: 31rem;
	height: 31rem;
	position: absolute;
	left: -38rem;
	top: 5%;
	background: url(../img/circle_l.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
}
.point-area .point-block:last-of-type:before{
	content: "";
	display: block;
	width: 10.4rem;
	height: 20rem;
	position: absolute;
	right: -5%;
	bottom: -10%;
	background: url(../img/particle03.svg) center top no-repeat;
	background-size: contain;
	transform: scaleY(-1);
	z-index: -1;
}
.point-area .point-block:last-of-type:after{
	content: "";
	display: block;
	width: 31rem;
	height: 31rem;
	position: absolute;
	left: -38rem;
	top: 20%;
	background: url(../img/circle_l.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
}
.point-area .point-block .ttl{
	display: flex;
	align-items: center;
	font-size: 2.2rem;
	font-weight: bold;
	margin-bottom: 2.4rem;
}
.point-area .point-block .ttl img{
	margin-right: 1.6rem;
}
.point-area .point-block.row-col1{
	width: 100%;
	justify-content: space-between;
	align-items: center;
	padding: 4rem 0;
}
.point-area .point-block.row-col1 > div:first-child{
	width:50%;
}
.point-area .point-block.row-col1 > div:last-child{
	width:46%;
	padding: 4em 2em;
}
.point-area .point-block.row-col2{
	justify-content: space-between;
}
.point-area .point-block.row-col2 >div{
	width: 50%;
	padding: 2em 3em;
}
.point-area .point-block.row-col2 >div img{
	margin-bottom: 1.6rem;
}
.point-area .point-block.row-col2 >div:first-child{
	border-right: 2px solid #45B0E5;
}

@media screen and (max-width: 840px){
	.point-area .point-block{
		display: block;
	}
	.point-area .point-block.row-col1 > div:first-child,
	.point-area .point-block.row-col1 > div:last-child,
	.point-area .point-block.row-col2 >div{
		width: 100%;
	}
	.point-area .point-block.row-col1 > div:last-child{
		padding: 2em 0;
	}
	.point-area .point-block.row-col2 >div:first-child{
		border-right: none;
		border-top: 2px solid #45B0E5;
		border-bottom: 2px solid #45B0E5;
	}
	.point-area .point-block.row-col2 >div{
		padding: 2em 0;
	}
	.point-area .point-block .ttl img{
		width: 20vw;
	}
	.point-area:before{
		width: 15rem;
		height: 15rem;
		right: -5rem;
	}
	.point-area .point-block:nth-of-type(2):after{
		width: 15rem;
		height: 15rem;
		left: -8rem;
	}
	.point-area .point-block:last-of-type:after{
		width: 15rem;
		height: 15rem;
		left: -8rem;
	}
}


/* retouch-check-area */
.retouch-check-area{
	background: url(../img/bg_retouch_check.jpg) no-repeat center center / cover;
	clip-path: polygon(0% 8%, 100% 0%, 100% 100%, 0% 95%);
	padding: 8rem 0;
	margin: 2.4rem calc(50% - 50vw) 4rem 0;
}
.retouch-check-area .base-row .ttl{
	position: relative;
}
.retouch-check-area .base-row .ttl .bubble{
	position: absolute;
	bottom: 20%;
	right: 0;
}

.retouch-check-area .base-row{
	display: flex;
	justify-content: space-between;
}
.retouch-check-area .base-row > div:first-child{
	width: 40%;
}
.retouch-check-area .base-row > div:first-child .ttl{
	max-width: 405px;
	margin-bottom: 2em;
}
.retouch-check-area .base-row > div:first-child .txt{
	padding: 1em;
}
.retouch-check-area .base-row > div:last-child{
	width: 50.6%;
}

@media screen and (max-width: 840px){
	.retouch-check-area .base-row{
		display: block;
	}
	.retouch-check-area .base-row > div:first-child,
	.retouch-check-area .base-row > div:last-child{
		width: 100%;
	}
	.retouch-check-area .base-row > div:first-child .ttl{
		margin: 0 auto;
		width: 30vw;
	}
}
/* retouch-area */
.retouch-area{
	position: relative;
}
.retouch-area:before{
	content: "";
	display: block;
	width: 10.4rem;
	height: 20rem;
	position: absolute;
	right: -5%;
	top: -10%;
	background: url(../img/particle03.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
}
.retouch-area:after{
	content: "";
	display: block;
	width: 31rem;
	height: 31rem;
	position: absolute;
	right: -30rem;
	top: 50%;
	background: url(../img/circle_l.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
}
.retouch-area .ttl-device{
	margin-top: 8rem;
}
.retouch-area .ttl-device span{
	color: #fff;
	font-size: 3rem;
	background: #45B0E5;
	margin: 0;
	padding: 0 2.4rem;
	display: inline-block;
	line-height: 1.6;
}
.retouch-area .retouch-block {
	display: flex;
}
.retouch-area .retouch-block .ttl{
	display: flex;
	align-items: center;
	font-size: 2.2rem;
	font-weight: bold;
	margin-bottom: 2.4rem;
}
.retouch-area .retouch-block .ttl img{
	margin-right: 1.6rem;
}
.retouch-area .retouch-block.row-col1{
	width: 100%;
	justify-content: space-between;
	align-items: center;
	padding: 4rem 0;
}
.retouch-area .retouch-block.row-col1 > div:first-child{
	width:50%;
}
.retouch-area .retouch-block.row-col1 > div:last-child{
	width:46%;
	padding: 4em 2em;
}
.retouch-area .retouch-block.row-col2{
	justify-content: space-between;
}
.retouch-area .retouch-block.row-col2 >div{
	width: 50%;
	padding: 2em 3em;
}
.retouch-area .retouch-block.row-col2 >div img{
	margin-bottom: 1.6rem;
}
.retouch-area .retouch-block.row-col2 >div:first-child{
	border-right: 2px solid #45B0E5;
}
.retouch-area .retouch-block.row-col3{
	justify-content: space-between;
}
.retouch-area .retouch-block.row-col3 >div{
	width: 33%;
	padding: 2em 3em;
	border-right: 2px solid #45B0E5;
}
.retouch-area .retouch-block.row-col3 >div img{
	margin-bottom: 1.6rem;
}
.retouch-area .retouch-block.row-col3 >div:last-child{
	border-right: none
}

@media screen and (max-width: 840px){
	.retouch-area .retouch-block{
		display: block;
	}
	.retouch-area .retouch-block.row-col1 > div:first-child,
	.retouch-area .retouch-block.row-col1 > div:last-child,
	.retouch-area .retouch-block.row-col2 >div,
	.retouch-area .retouch-block.row-col3 >div{
		width: 100%;
	}
	.retouch-area .retouch-block.row-col1 > div:last-child{
		padding: 2em 0;
	}
	.retouch-area .retouch-block.row-col2 >div:first-child{
		border-right: none;
		border-top: 2px solid #45B0E5;
		border-bottom: 2px solid #45B0E5;
	}
	.retouch-area .retouch-block.row-col2 >div{
		padding: 2em 0;
	}
	.retouch-area .retouch-block .ttl img{
		width: 20vw;
	}
	.retouch-area .retouch-block.row-col3 > div{
		border-right: none;
	}
	.retouch-area:after{
		width: 15rem;
		height: 15rem;
		right: -5rem;
	}
}



/* shoot-area */
.shoot-area{
	padding: 8rem 0 4rem 0;
}
.shoot-area .ttl-shoot{
	text-align: center;
	margin-bottom: 4rem;
}
@media screen and (max-width: 840px){
	.shoot-area .ttl-shoot img{
		width: 40vw;
	}
}


/* tab-area */
.tab-area .tab-list{
	display: flex;
	justify-content: center;
	align-items:flex-end;
	position: relative;
}
.tab-area .tab-list:before{
	content: "";
	display: block;
	position: absolute;
	height: 2px;
	width: 90%;
	background:#2C190E;
	z-index: -1;
}
.tab-area .tab-list li{
	font-size: 2.2rem;
	font-weight: bold;
	width: 28%;
	margin-right: 1%;
	text-align: center;
	cursor: pointer;
	background: #EBEDF0;
	padding: 0.8rem;
	margin-bottom: 2px;
}
.tab-area .tab-list li span{
	font-size: 2.5rem;
}
.tab-area .tab-list li:nth-child(3){
	margin-right: 0;
}
.tab-area .tab-list li.active{
	background: #fff;
	border-top: 2px solid #2C190E;
	border-left: 2px solid #2C190E;
	border-right: 2px solid #2C190E;
	border-bottom: 2px solid #fff;
	padding: 1.6rem;
	margin-bottom: 0;
}
@media screen and (max-width: 840px){
	.tab-area .tab-list li{
		font-size: 1.6rem;
		padding: 0.4rem;
		width: 32%;
	}
	.tab-area .tab-list li span{
		font-size: 1.8rem;
	}
	.tab-area .tab-list li.active{
		padding: 0.8rem;
	}
	.tab-area .tab-list:before{
		width: 100%;
	}
}


/* tab-contents */
.tab-contents{
	padding: 8rem 0 0;
}
.tab-contents .gourmet{
	position: relative;
}
.tab-contents .gourmet:after{
	content: "";
	display: block;
	width: 6.4rem;
	height: 16rem;
	position: absolute;
	left: -5%;
	bottom: -2%;
	background: url(../img/particle03.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
}
.tab-contents .row-col2{
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 8rem 0;
	position: relative;
}
.tab-contents .row-col2:before{
	content: "";
	display: block;
	width: 16rem;
	height: 34rem;
	position: absolute;
	right: 0;
	top: 0;
	background: url(../img/particle02.svg) center top no-repeat;
	background-size: contain;
	z-index: -1;
}
.tab-contents .row-col2:after{
	content: "";
	display: block;
	position: absolute;
	background: url(../img/bg_line01.svg)no-repeat left top / contain;
	width: 100vw;
	height: 100%;
	min-height: 86rem;
	top: -15rem;
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
}
.tab-contents .row-col2>div:first-child{
	width: 35%;
}
.tab-contents .row-col2>div:last-child{
	width: 60%;
}
.tab-contents .row-col2.subpht-r>div:first-child{
	width: 35%;
	position: relative;
}
.tab-contents .row-col2.subpht-r>div:nth-child(2){
	width: 60%;
}
.tab-contents .row-col2.subpht-r>div:last-child{
	width: 100%;
}
.tab-contents .row-col2.subpht-r .subpht{
	position: absolute;
	bottom: 0;
	left: -15%;
}

.tab-contents .row-col2 .ttl{
	display: grid;
	grid-template-columns: 115px 1fr;
	align-items: center;
	flex-wrap: wrap;
	gap: .5rem 2rem;
	margin-bottom: 1.6rem;
}
.tab-contents .row-col2 .ttl.add-p{
	grid-template-columns: 115px 1fr;
	grid-template-rows: 0fr .5fr;
	margin-bottom: 3rem;
}
.tab-contents .row-col2 .ttl.add-p img.spot{
	grid-column: 1;
	grid-row: 1 / 3;
}
.tab-contents .row-col2 .ttl.add-p img:not(.spot){
	grid-column: 2;
	grid-row: 1 / 2;
}
.tab-contents .row-col2 .ttl.add-p p{
	grid-column: 2 / 3;
	grid-row: 2 / 3;
}
.tab-contents .row-col2 .txt-block{
	position: relative;
}
.tab-contents .row-col2 .txt-block p{
	margin-bottom: 1.5em;
}
.tab-contents .row-col2 .pht-main{
	position: relative;
	z-index: 0;
}
.tab-contents .row-col2 .pht-main .copy{
	position: absolute;
	top: -10%;
	left: -5%;
	z-index: 1;
	width: 40%;
}

.tab-contents .sub-pht{
	display: flex;
	flex-direction: row-reverse;
	flex-wrap: wrap;
}

.tab-contents .sub-pht > div{
	width: 50%;
}
.tab-contents .sub-pht > div:last-child{
	width: 48%;
	margin-right: 2%;
}
.tab-contents .sub-pht > div.fade{
	width: 100%;
	position: relative;
}
.tab-contents .sub-pht > div.fade:before{
	content: "";
	display: block;
	width: 24rem;
	height: 20rem;
	position: absolute;
	left: -18%;
	bottom: 6%;
	background: url(../img/particle01.svg) center no-repeat;
}
.tab-contents .sub-pht > div.fade >img{
	max-width: 40%;
}

@media screen and (max-width: 840px){
	.tab-contents .row-col2{
		display: block;
	}
	.tab-contents .row-col2>div:first-child,
	.tab-contents .row-col2>div:last-child{
		width: 100%;
		margin-bottom: 2.4rem;
	}
	.tab-contents .row-col2 .pht-main{
		margin-left: 2.4rem;
		margin-top: 6rem;
	}
	.tab-contents .row-col2 .ttl img{
		/* width: 20vw; */
	}
	.tab-contents .row-col2.subpht-r{
		display: flex;
		flex-direction: column;
	}
	.tab-contents .row-col2.subpht-r>div:first-child{
		width: 100%;
		position: unset;
	}
	.tab-contents .row-col2.subpht-r>div:nth-child(2){
		width: 100%;
	}
	.tab-contents .row-col2.subpht-r .subpht{
		left: auto;
		right: 0;
		max-width: 50%;
		z-index: 1;
		z-index: 0;
	}
		
	.tab-contents .row-col2.subpht-r>div:last-child{
		width: 50%;
		margin-left: 0;
		margin-top: 0;
		margin-bottom: 35px;
	}
	.tab-contents .sub-pht > div.fade:before{
		left: auto;
		right: 0;
		background-size: cover;
	}
}



.ttl-date{
	margin: 1.6rem 0 0 0;
}
.date-wrap{
	display: flex;
	flex-wrap: wrap;
	font-size: 1.3rem;
}
.date-wrap dt{
	width: 6em;
}
.date-wrap dd{
	width: calc(100% - 6em);
}
.btn-base {
	margin: 1.6rem 0;
}
.btn-base a{
	color: #333333;
	font-size: 1.3rem;
	padding: 0.4rem 2.4rem;
	background: #EBEDF0;
	text-decoration: none;
	display: inline-block;
	border-radius: 33px;
}
.btn-base a:hover{
	color: #fff;
	background: #333;
}


/* wide-area */
.wide-area{
	background: #FDF009;
	padding: 8rem 8rem 4rem 8rem;
	margin: 2.4rem calc(50% - 50vw) 4rem 0;
	transition: 1s;
}
.wide-area.fadeInUp{
	background: #EBEEF0;
}
.wide-area .wide-inner{
	max-width: 1180px;
	position: relative;
}
.wide-area .wide-inner .ttl-photospot-point{
	position: absolute;
	top: -22rem;
	right: 0;
}
.wide-area .photospot-col2{
	display: flex;
	flex-wrap: wrap;
}
.wide-area .photospot-col2 > div{
	width: 48%;
	margin-right: 4%;
	display: flex;
	justify-content: space-between;
	margin-bottom: 4rem;
}
.wide-area .photospot-col2 > div:nth-child(2n){
	margin-right: 0;
}
.wide-area .photospot-col2 > div figure,
.wide-area .photospot-col2 > div> p{
	width: 48%;
}

.wide-area .photospot-col2 > div> p{
	font-size: 1.6rem;
}

.wide-area.phototrip {
	position: relative;
	z-index: 0;
}
.wide-area.phototrip:before{
	content: "";
	display: block;
	width: 49rem;
	height: 14.8rem;
	position: absolute;
	right: 5%;
	bottom: 10%;
	background: url(../img/txt_phototrip.svg) center no-repeat;
	background-size: cover;
}
@media screen and (max-width: 840px){
	.wide-area{
		padding: 4rem 2rem;
	}
	.wide-area .photospot-col2 > div{
		width: 100%;
		margin-right: 0;
	}
	.wide-area .wide-inner .ttl-photospot-point{
		top: -15rem;
	}
	.wide-area .wide-inner .ttl-photospot-point >img{
		width: 30vw;
	}
	.wide-area.phototrip:before{
		width: 44vw;
		height: 9vh;
		bottom: 3%;
		background-size: contain;
	}
}

/* --------------------------------------------------
deco-block
-------------------------------------------------- */
.deco-block{
	position: relative;
	padding: 12rem 0;
	margin: 0 calc(50% - 50vw);
	width: 100vw;
}
.deco-block:after{
	content: "";
	display: block;
	position: absolute;
	background: url(../img/bg_line02.svg)no-repeat center top / cover;
	width: 100vw;
	height: 26rem;
	top: -20rem;
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
}
.deco-block .particle{
	position: absolute;
	top: -50%;
	left: 3%;
	transform: rotate(45deg);
}
.deco-block .circle-s{
	position: absolute;
	right: 25%;
	max-width: 80px;
	top: 19%;
}
.deco-block .circle{
	position: absolute;
	right: 15%;
	top: 15%;
}
.deco-block .square{
	position: absolute;
	top: -15%;
	right: 2%;
}
@media screen and (max-width: 840px){
	.deco-block:after{
		background: url(../img/bg_line02.svg)no-repeat center top / contain;
	}
	.deco-block .particle{
		width: 14rem;
	}
	.deco-block .circle-s{
		right: 42%;
		top: 5%;
	}
	.deco-block .square{
		width: 10rem;
		top: -36%;
	}

}

.deco-lb{
	position: relative;
}
.deco-lb:before{
	content: "";
	display: block;
	width: 24rem;
	height: 20rem;
	position: absolute;
	left: -18%;
	bottom: -12%;
	background: url(../img/particle01.svg) center no-repeat;
	z-index: -1;
}
@media screen and (max-width: 840px){
	.deco-lb:before{
		content: none;
	}

}


/* --------------------------------------------------
footer
-------------------------------------------------- */
#footer {
	padding: 1em 0;
}
#footer .copy{
	text-align: center;
}

/* --------------------------------------------------
animation
-------------------------------------------------- */
/* --------------------------------------------------
	カーテン
	-------------------------------------------------- */
	.fx-curtain figure::before{
		content: '';
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
		background: #FFF;
		z-index: 2;
		transition: .5s;
	}
	.fx-curtain.show figure::before{
		transform: translateX(100%);
	}
	.fx-curtain img{
		opacity: 0;
		transition: .5s;
	}
	.fx-curtain.show img{
		opacity: 1;
	}
	
	/* mv */
	.mv-row .mv-copy.fx-curtain{
		opacity: 0;
		transform: translateY(40px);
		transition: .5s;
		transition-delay: .5s;
		overflow: hidden;
	}
	.mv-row .mv-copy.fx-curtain.show {
		opacity: 1;
		transform: translateX(0);
	}
	.mv-row .mv-copy.fx-curtain:before{
		content: '';
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
		background: url(../img/bg_copy_phototrip_y.svg) center repeat;
		transition: .5s;
		transition-delay: 1s;
		z-index: -1;
	}
	.mv-row .mv-copy.fx-curtain.show:before{
		transform: translateX(200%) rotate(-45deg);
	}
	.mv-row .mv-copy.fx-curtain:after{
		opacity: 0;
		transition: .3s;
		transition-delay: 1s;
	}
	.mv-row .mv-copy.fx-curtain.show:after{
		opacity: 1;
	}
	.mv-row h1.fadeUpTrigger:after {
		opacity: 0;
		transition: .5s;
		transition-delay: .5s;
		transform: translateY(10%) rotate(-20deg);
	}
	.mv-row h1.fadeUpTrigger.fadeInUp:after {
		opacity: 1;
		transform: none;
	}

	@media screen and (max-width: 840px) {
		.photogenic-area .inner-m > div:first-child{
			padding: 1em 1em 2em 1em;
		}
	}

	.photogenic-area.fade-rotate-left .inner-m:before{
		width: 0;
		transition: .5s;
		transition-delay: 1s;
		background: #FDF009;
	}
	.photogenic-area.fade-rotate-left.fadeIn-left .inner-m:before{
		width: 60%;
		background: #EBEDF0;
	}

	.point-check-area.fadeUpTrigger{
		opacity: 0;
		transition: 1s;
		transition-delay: .5s;
		transform: translateY(20%);
	}
	.point-area .ttl-device.fadeUpTrigger,
	.point-area .point-block.fadeUpTrigger{
		opacity: 0;
		transition: 1s;
		transition-delay: .5s;
		transform: translateY(5%);
	}
	.point-check-area .ttl.fadeUpTrigger .bubble{
		opacity: 0;
		transition: .5s;
		transition-delay: .5s;
		transform: translate(-50% ,50%);
	}
	.retouch-check-area .ttl.fadeUpTrigger .bubble {
		opacity: 0;
		transition: .5s;
		transition-delay: .5s;
		transform: translateY(50%);
	}
	.point-check-area.fadeUpTrigger.fadeInUp,
	.point-area .point-block.fadeUpTrigger.fadeInUp,
	.point-area .ttl-device.fadeUpTrigger.fadeInUp {
		opacity: 1;
		transform: translateY(0);
	}
	.point-check-area .ttl.fadeUpTrigger.fadeInUp .bubble {
		opacity: 1;
		transform: translateX(-50%) translateY(0);
	}
	.retouch-check-area .ttl.fadeUpTrigger.fadeInUp .bubble {
		opacity: 1;
		transform: translateY(0) rotateZ(0);
	}

	.deco-block.fadeUpTrigger .particle{
		opacity: 0;
		transition: 1s;
		transition-delay: .5s;
		transform: translateY(20%) rotate(-30deg);
	}
	.deco-block.fadeUpTrigger .square{
		opacity: 0;
		transition: 1s;
		transition-delay: .8s;
		transform: rotate(20deg);
	}
	.deco-block.fadeUpTrigger .circle-s{
		opacity: 0;
		transition: 1s;
		transition-delay: .7s;
		transform: rotate(20deg);
		animation: role 30s linear infinite;
	}
	.deco-block.fadeUpTrigger .circle{
		opacity: 0;
		transition: 1s;
		transition-delay: .6s;
		transform: rotate(20deg);
		animation: role-reverse 30s linear infinite;
	}
	.deco-block.fadeUpTrigger.fadeInUp .square,
	.deco-block.fadeUpTrigger.fadeInUp .circle-s,
	.deco-block.fadeUpTrigger.fadeInUp .circle{
		opacity: 1;
		transform: none;
	}
	.deco-block.fadeUpTrigger.fadeInUp .particle{
		opacity: 1;
		transform: translateY(0) rotate(-70deg);
	}
	@keyframes role{
		0% {
			transform: rotate(0);
		}
		
		100% {
			transform: rotate(360deg);
		}
	}
	@keyframes role-reverse{
		0% {
			transform: rotate(0);
		}
		
		100% {
			transform: rotate(-360deg);
		}
	}

	@media screen and (min-width: 841px) {
	}

	@media screen and (max-width: 840px) {
		.mv-row h1.fadeUpTrigger.fadeInUp::after {
				opacity: 0 !important;
			}
			.point-check-area .ttl.fadeUpTrigger.fadeInUp .bubble {
				transform: translateX(-35%) translateY(0);
			}
			.retouch-check-area .ttl.fadeUpTrigger.fadeInUp .bubble {
				transform: translateY(0) rotateZ(0);
				right: auto;
			}
	}