@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@600;700;800;900&display=swap');

/* ----------------------------------------------------------------------------------------------------
*  基本情報
* --------------------------------------------------------------------------------------------------*/

html,body{
	height:100%;
}

html{
	font-size:62.5%;
	overflow-y: scroll;
}
@media screen and (min-width: 1921px) {
	html {
		font-size: 62.5%;
	}
}
@media screen and (max-width: 1920px) {
	html {
		font-size: calc(100vw * 10 / 1920);
	}
}
@media screen and (max-width: 768px) {
	html {
		font-size: calc(100vw * 10 / 375);
	}
}

body{
	-webkit-text-size-adjust: 100%;
}

body, h1, h2, h3, h4, h5, h6, p, address,
ul, ol, li, dl, dt, dd,
table, th, td, img, figure, form {
	margin: 0;
	padding: 0;
	border: none;
	list-style-type: none;
}

body, h1, h2, h3, h4, h5, h6, p, address,
ul, ol, li, dl, dt, dd,
table, th, td, img, figure,
form, input, textarea, select, button, div{
	font-style: normal;
	font-weight: normal;
	font-family: 'Noto Sans JP', "メイリオ",Meiryo,"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",Arial,Verdana,sans-serif;
	text-align: left;
	word-break: break-word;
	line-height: 1;
	color: #000;
	font-size: 2.0rem;
}

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

table{
	border-spacing: 0;
}

input, textarea, select, button{
	vertical-align:middle;
	background-color: #fff;
}
button{
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
}
input,select,button,textarea{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	outline: none;
	border: none;
	border-radius: 0;
	padding: 0;
}
select::-ms-expand{
	display: none;
}
textarea{
	resize: none;
}
button,input[type="submit"],input[type="button"],select,label{
	cursor: pointer;
}
input[type="radio"]:checked{
	appearance: none;
}
blockquote{
	margin: 0;
	padding: 0;
}

img{
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

a,
button,
input[type="submit"],
input[type="button"]{
	text-decoration: none;
	color: inherit;
	-webkit-transition: opacity .4s ease;
	transition: opacity .4s ease;
}
@media screen and (min-width: 769px) {
	a:hover,
	button:hover,
	input[type="submit"]:hover,
	input[type="button"]:hover{
		opacity: 0.5;
	}

	a[href^="tel:"]{
		display: inline-block;
		pointer-events: none;
	}
}

.wrap{
	max-width: 162.0rem;
	width: 100%;
	margin: 0 auto;
}

.bg_content{
	position: relative;
	padding: 4.7rem 4.7rem 4.6rem 4.6rem;
	overflow: hidden;
}
.bg_content::before{
	position: absolute;
	z-index: -1;
	top: 4.7rem;
	left: 4.7rem;
	content: "";
	display: block;
	width: calc(100% - 9.3rem);
	height: calc(100% - 9.3rem);
	pointer-events: none;
	background: url(../img/bg_img01.png) repeat-y center top;
	background-size: 100%;
}

.en{
	font-family: 'Poppins', sans-serif;
}

.num{
	font-family: 'Barlow', sans-serif;
}

@media screen and (min-width: 769px) {
	.sp{
		display: none !important;
	}
}

@media screen and (max-width: 768px) {
	.wrap{
		width: 100%;
		max-width: initial;
	}

	body, h1, h2, h3, h4, h5, h6, p, address,
	ul, ol, li, dl, dt, dd,
	table, th, td, img, figure,
	form, input, textarea, select, button, div{
		font-size: 1.4rem;
	}

	img{
		width: 100%;
	}

	.pc{
		display: none !important;
	}
	.sp_ib{
		display: inline-block;
	}

	.bg_content{
		padding: 1.7rem 1.7rem 1.6rem 1.6rem;
	}
	.bg_content::before{
		top: 1.7rem;
		left: 1.7rem;
		width: calc(100% - 3.3rem);
		height: calc(100% - 3.3rem);
		background: url(../img/bg_img01_sp.png) repeat-y center top;
		background-size: 100%;
	}
}




/* ----------------------------------------------------------------------------------------------------
*  ヘッダー
* --------------------------------------------------------------------------------------------------*/
.gnav{
	position: fixed;
	z-index: 9999;
	top: 4.7rem;
	right: -70.0rem;
	width: 60.0rem;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	overflow: hidden;
}
.gnav.active{
	right: 0;
}

.gnav_bg{
	position: fixed;
	z-index: 9998;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(255,255,255, 0.5);
	opacity: 0;
	visibility: hidden;
	-webkit-transition: opacity .4s ease-in-out;
	transition: opacity .4s ease-in-out;
	pointer-events: none;
}
.gnav_bg.active{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.gnav_wrap{
	width: 100%;
	padding: 5.5rem 12.0rem 6.0rem 6.5rem;
	max-height: calc(100vh - 4.7rem);
	background: #D8D8D8;
	border-top: 0.5rem solid #000;
	border-bottom: 0.5rem solid #000;
	border-left: 0.5rem solid #000;
	border-radius: 3rem 0 0 3rem;
	overflow: auto;
}

.menu_btn{
	position: fixed;
	z-index: 10000;
	top: 4.7rem;
	right: 0;
	width: 8.8rem;
	height: 8.8rem;
	background: #fff;
	border-top: 0.5rem solid #000;
	border-left: 0.5rem solid #000;
	border-bottom: 0.5rem solid #000;
	border-radius: 2rem 0 0 2rem;
	cursor: pointer;
	-webkit-transition: transform .4s ease;
	transition: transform 0.4s;
	transform-origin: right center;
}
.menu_btn .line{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 1.9rem;
	margin: auto;
	width: 4rem;
	height: 0.4rem;
	background: #000;
	-webkit-transition: all .4s ease;
	transition: all .4s ease;
}
.menu_btn .line:nth-child(1){
	top: -2.8rem;
}
.menu_btn .line:nth-child(3){
	bottom: -2.8rem;
}
.menu_btn.active .line:nth-child(1){
	top: 0;
	transform: rotate(45deg);
}
.menu_btn.active .line:nth-child(2){
	opacity: 0;
}
.menu_btn.active .line:nth-child(3){
	bottom: 0;
	transform: rotate(-45deg);
}

.contact_btn{
	position: fixed;
	z-index: 10000;
	top: 19.4rem;
	right: 0;
}

.contact_btn a{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 8.8rem;
	height: 29.3rem;
	border-radius: 2rem 0 0 2rem;
	background: #B9000C;
	text-align: center;
	font-size: 2.8rem;
	font-weight: bold;
	color: #fff;
	letter-spacing: 0.15em;
	-webkit-transition: transform .4s ease;
	transition: transform 0.4s;
	transform-origin: right center;
}
@media screen and (min-width: 769px) {
	.menu_btn:hover,
	.contact_btn a:hover {
		opacity: 1;
		transform: scale(1.08);
	}
}

.gnav_list li + li{
	margin-top: 3rem;
}

.gnav_list li a{
	display: block;
	font-size: 1.6rem;
	line-height: 1.5;
	-webkit-transition: color .4s ease;
	transition: color .4s ease;
}
.gnav_list li .en{
	display: block;
	font-size: 3.0rem;
	font-weight: bold;
	line-height: 1.3;
}

.gnav_sub_list{
	margin-top: 6rem;
}
.gnav_sub_list li + li{
	margin-top: 3rem;
}

.gnav_sub_list li a{
	display: block;
	font-size: 2.0rem;
	line-height: 1.5;
	font-weight: bold;
	-webkit-transition: color .4s ease;
	transition: color .4s ease;
}

.gnav .corporate_btn{
	display: flex;
	margin-top: 7rem;
}
.gnav .corporate_btn a{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 4rem;
	height: 4rem;
	border-radius: 2rem;
	border: 0.3rem solid #000;
	font-size: 2.0rem;
	font-weight: 600;
	line-height: 1.5;
	background: #fff;
	-webkit-transition: background .4s ease;
	transition: background .4s ease;
}

@media screen and (min-width: 769px) {
	.gnav_list li a:hover,
	.gnav_sub_list li a:hover {
		opacity: 1;
		color: #FFF13C;
	}

	.gnav_list li.gnav_graphic a:hover{
		color: #69C3FC;
	}
	.gnav_list li.gnav_web a:hover{
		color: #EAB015;
	}
	.gnav_list li.gnav_video a:hover{
		color: #ED8CBC;
	}
	.gnav_list li.gnav_studio a:hover{
		color: #5BDE75;
	}

	.gnav .corporate_btn a:hover{
		opacity: 1;
		background: #FFF793;
	}
}

.gnav .sns_box{
	display: flex;
	align-items: center;
	margin-top: 5rem;
}

.gnav .sns_box li + li{
	margin-left: 3rem;
}

.gnav .sns_box li.sns_fb{
	width: 3rem;
}
.gnav .sns_box li.sns_ig{
	width: 3rem;
}
.gnav .sns_box li.sns_yt{
	width: 3.4rem;
}
.gnav .sns_box li.sns_nt{
	width: 9.2rem;
}



@media screen and (max-width: 768px) {
	.gnav{
		top: 1.7rem;
		right: -110%;
		width: calc(100% - 1.7rem);
	}

	.gnav_wrap{
		padding: 4.0rem 5.0rem 4.0rem 4.0rem;
		max-height: calc(100vh - 1.7rem);
		border-width: 0.3rem;
		border-radius: 1rem 0 0 1rem;
	}

	.menu_btn{
		top: 1.7rem;
		width: 4.0rem;
		height: 4.0rem;
		border-width: 0.3rem;
		border-radius: 1rem 0 0 1rem;
	}
	.menu_btn .line{
		left: 0.8rem;
		width: 1.8rem;
		height: 0.2rem;
	}
	.menu_btn .line:nth-child(1){
		top: -1.4rem;
	}
	.menu_btn .line:nth-child(3){
		bottom: -1.4rem;
	}

	.contact_btn{
		top: 8.3rem;
	}
	.contact_btn a{
		width: 4.0rem;
		height: 17.0rem;
		border-radius: 1rem 0 0 1rem;
		font-size: 1.5rem;
	}

	.gnav_list li + li{
		margin-top: 2rem;
	}

	.gnav_list li a{
		font-size: 1.1rem;
	}
	.gnav_list li .en{
		font-size: 2.1rem;
	}

	.gnav_sub_list{
		margin-top: 3rem;
	}
	.gnav_sub_list li + li{
		margin-top: 1.7rem;
	}

	.gnav_sub_list li a{
		font-size: 1.5rem;
	}

	.gnav .corporate_btn{
		margin-top: 3rem;
	}
	.gnav .corporate_btn a{
		padding: 0 2rem;
		height: 3rem;
		border: 0.1rem solid #000;
		font-size: 1.4rem;
	}

	.gnav .sns_box{
		display: flex;
		align-items: center;
		margin-top: 2.4rem;
	}

	.gnav .sns_box li + li{
		margin-left: 2rem;
	}

	.gnav .sns_box li.sns_fb{
		width: 2.4rem;
	}
	.gnav .sns_box li.sns_ig{
		width: 2.4rem;
	}
	.gnav .sns_box li.sns_yt{
		width: 2.6rem;
	}
	.gnav .sns_box li.sns_nt{
		width: 6.0rem;
	}
}



/* ----------------------------------------------------------------------------------------------------
*  フッター
* --------------------------------------------------------------------------------------------------*/
.footer_wrap{
	padding: 10.0rem 0 8.0rem;
}

.footer_box{
	display: flex;
	align-items: center;
	justify-content: center;
}

.footer_box .logo{
	width: 20.1rem;
	margin-right: 3.5rem;
}

.footer_box .txt{
	text-align: center;
	font-weight: bold;
}

.footer_wrap .copy{
	margin-top: 3.5rem;
	text-align: center;
}


@media screen and (max-width: 768px) {
	.footer_wrap{
		padding: 5.0rem 0 5.0rem;
	}

	.footer_box{
		flex-direction: column;
	}

	.footer_box .logo{
		width: 16.0rem;
		margin-right: 0;
		margin-bottom: 1rem;
	}

	.footer_box .txt{
		font-size: 1.5rem;
	}

	.footer_wrap .copy{
		margin-top: 2.5rem;
	}
}




/* ----------------------------------------------------------------------------------------------------
*  共通
* --------------------------------------------------------------------------------------------------*/
.txt{
	line-height: 2;
}

.bold{
	font-weight: bold;
}

.txt_up{
	text-transform: uppercase;
}
.txt_noup{
	text-transform: none;
}

.txt_center{
	text-align: center;
}
.txt_right{
	text-align: right;
}
.txt_left{
	text-align: left;
}

@media screen and (min-width: 769px) {
	.pc_tate{
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		white-space: nowrap;
	}
}
.tate{
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	white-space: nowrap;
}


@media screen and (max-width: 768px) {
	.img img{
		width: 100%;
	}

	.txt{
		line-height: 1.8;
	}
}



/* ------------------------------
	.box
------------------------------ */
.flex{
	display: flex;
	justify-content: space-between;
}

.shadow{
	background: #fff;
	border: 0.5rem solid #000;
	border-radius: 3rem;
	box-shadow: 0.9rem 0.9rem 0 #000;
	overflow: hidden;
}


@media screen and (max-width: 768px) {
	.shadow{
		border-width: 0.3rem;
		border-radius: 1.4rem;
		box-shadow: 0.3rem 0.3rem 0 #000;
	}
}



/* ----------------------------------------------------------------------------------------------------
*  コンテンツ
* --------------------------------------------------------------------------------------------------*/

/* ------------------------------
	.mv
------------------------------ */
.mv{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding-bottom: 14.3rem;
}

.mv .logo_box{
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 0 2.8rem;
	height: 11.0rem;
	border-radius: 2rem;
	box-shadow: 0.5rem 0.5rem 0 #000;
}

.mv .logo_box .logo_txt{
	margin-bottom: 0.6rem;
	font-size: 1.6rem;
	line-height: 1.5;
	font-weight: bold;
}

.mv .logo_box .logo{
	width: 23.0rem;
}

.mv .mv_box{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 79.1rem;
	height: 65.9rem;
	margin-left: 16.7rem;
	margin-top: -5rem;
}

.mv .mv_txt{
	width: 59.7rem;
}

.mv_nav{
	display: flex;
	justify-content: space-between;
	width: 95.5rem;
	margin-left: 10.5rem;
	margin-top: 6.6rem;
}

.mv_nav .mv_nav_item a{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 10.3rem;
	border-radius: 2rem;
	-webkit-transition: transform .4s ease;
	transition: transform 0.4s;
	box-shadow: 0.6rem 0.6rem 0 #000;
}
@media screen and (min-width: 769px) {
	.mv_nav .mv_nav_item a:hover {
		opacity: 1;
		transform: scale(1.08);
	}
}

.mv_nav .mv_nav_item .en{
	display: block;
	padding: 0 4rem;
	font-size: 3.6rem;
	line-height: 1;
	font-weight: bold;
}

.mv_nav .mv_nav_item .txt{
	position: relative;
	padding: 0 3.5rem 0 0.5rem;
	line-height: 1.5;
	font-size: 1.8rem;
	font-weight: bold;
}
.mv_nav .mv_nav_item .txt::before{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0.5rem;
	margin: auto;
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-top: 1.5rem solid #000;
	border-right: 0.9rem solid transparent;
	border-left: 0.9rem solid transparent;
}

.mv_nav .mv_nav_item.nav01 a{
	background: #ACF2F8;
}
.mv_nav .mv_nav_item.nav02 a{
	background: #FFD76C;
}
.mv_nav .mv_nav_item.nav03 a{
	background: #FFC6E2;
}
.mv_nav .mv_nav_item.nav04 a{
	background: #9DFAAF;
}

.mv .lead_txt{
	position: relative;
	margin-top: 5rem;
	margin-left: 10.5rem;
	padding-bottom: 6.8rem;
	font-size: 3.0rem;
	font-weight: bold;
	line-height: 2;
	letter-spacing: 0.08em;
}
.mv .lead_txt::before{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-top: 2.6rem solid #000;
	border-right: 2.0rem solid transparent;
	border-left: 2.0rem solid transparent;
}

.mv .right_box{
	position: absolute;
	top: 0;
	right: 9.4rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 66.2rem;
}

.mv .right_ttl_box{
	position: relative;
	z-index: 2;
}
.mv .right_ttl_box a{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 18.4rem;
	padding: 0 3.7rem;
	-webkit-transition: transform .4s ease;
	transition: transform 0.4s;
}
@media screen and (min-width: 769px) {
	.mv .right_ttl_box a:hover {
		opacity: 1;
		transform: scale(1.08);
	}
}

.mv .right_ttl{
	position: relative;
	display: block;
	text-align: center;
	font-size: 2.6rem;
	font-weight: bold;
}

.mv .right_ttl .min{
	font-size: 2.0rem;
	margin: 0 0.2em;
}
.mv .right_ttl .num{
	margin-right: 0.2em;
	font-size: 5.0rem;
	font-weight: 800;
	color: #FFF793;
	text-stroke: 0.3rem #000;
	-webkit-text-stroke: 0.3rem #000;
	line-height: 1;
}
.mv .right_ttl .big{
	font-size: 4.5rem;
}
.mv .right_ttl .big .num{
	margin-right: 0.1em;
	font-size: 9.0rem;
	letter-spacing: 0.05em;
	text-shadow: 0.3rem 0.3rem 0 #000;
}

.mv .right_ttl::before{
	position: absolute;
	right: -0.2rem;
	bottom: 1.5rem;
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-top: 2.1rem solid #000;
	border-right: 1.2rem solid transparent;
	border-left: 1.2rem solid transparent;
}

.mv .right_box .movie{
	margin-left: auto;
	width: 57.8rem;
	height: 59.5rem;
	margin-top: -1.3rem;
}

.info{
	position: relative;
	display: flex;
	align-items: flex-end;
	margin-left: 10.5rem;
	margin-top: -17.0rem;
}

.info .txt_box{
	width: 95.5rem;
	padding: 7.3rem 9rem 7rem;
}

.info .txt_box .logo{
	width: 25.0rem;
	margin-bottom: 3.6rem;
}

.info .txt_box .txt{
	line-height: 2.3;
}

.info_list{
	margin-left: 9.5rem;
	min-width: 49.4rem;
}

.info_list li{
	display: flex;
	align-items: center;
	width: 100%;
	padding: 1.5rem 0 1.5rem;
	border-radius: 2rem;
}
.info_list li + li{
	margin-top: 4.1rem;
}

.info_list li .num{
	flex-shrink: 0;
	width: 9.0rem;
	padding-bottom: 0.15em;
	text-align: center;
	font-size: 7.0rem;
	font-weight: bold;
	color: #FFF793;
	text-stroke: 0.3rem #000;
	-webkit-text-stroke: 0.3rem #000;
	line-height: 1;
}

.info_list li .ttl{
	font-size: 3.2rem;
	font-weight: bold;
	line-height: 1.3;
}

.info_list li .txt{
	line-height: 1.8;
}


@media screen and (max-width: 900px) {
	.info{
		margin-top: -6.0rem;
	}
}


@media screen and (max-width: 800px) {
	.info{
		margin-top: 0;
	}
}


@media screen and (max-width: 768px) {
	.mv{
		padding-bottom: 7.6rem;
	}

	.mv .logo_box{
		width: 18.7rem;
		height: 6.4rem;
		padding: 0;
		border-radius: 1rem;
		box-shadow: 0.3rem 0.3rem 0 #000;
	}

	.mv .logo_box .logo_txt{
		margin-bottom: 0.4rem;
		font-size: 1.0rem;
	}

	.mv .logo_box .logo{
		width: 14.4rem;
	}

	.mv .mv_box{
		width: 29.3rem;
		height: 28.3rem;
		margin-top: -2.4rem;
		margin-left: 1.2rem;
	}

	.mv .mv_txt{
		width: 24.0rem;
	}

	.mv_nav{
		width: 100%;
		padding-right: 0.3rem;
		margin-left: 0;
		margin-top: 3.3rem;
	}

	.mv_nav .mv_nav_item a{
		height: 8.0rem;
		border-radius: 1rem;
		box-shadow: 0.3rem 0.3rem 0 #000;
	}

	.mv_nav .mv_nav_item .en{
		padding: 0 1rem 0.2rem;
		font-size: 1.5rem;
	}

	.mv_nav .mv_nav_item .txt{
		text-align: center;
		padding: 0 1rem 1.3rem;
		line-height: 1.2;
		font-size: 1.2rem;
	}
	.mv_nav .mv_nav_item .txt::before{
		top: auto;
		bottom: 0;
		left: 0;
		right: 0;
		border-top: 0.8rem solid #000;
		border-right: 0.5rem solid transparent;
		border-left: 0.5rem solid transparent;
	}

	.mv .lead_txt{
		width: 100%;
		margin-left: 0;
		margin-top: 2.7rem;
		padding-bottom: 3.3rem;
		text-align: center;
		font-size: 1.8rem;
		line-height: 1.5;
	}
	.mv .lead_txt::before{
		border-top: 1.3rem solid #000;
		border-right: 1.0rem solid transparent;
		border-left: 1.0rem solid transparent;
	}

	.mv .right_box{
		position: relative;
		right: 0;
		width: 100%;
		margin-top: 2.2rem;
	}

	.mv .right_ttl_box a{
		height: 9.0rem;
		padding: 0 2rem;
	}

	.mv .right_ttl{
		font-size: 1.3rem;
	}
	.mv .right_ttl .min{
		font-size: 1.0rem;
	}
	.mv .right_ttl .num{
		font-size: 2.6rem;
		text-stroke: 0.2rem #000;
		-webkit-text-stroke: 0.2rem #000;
	}
	.mv .right_ttl .big{
		font-size: 2.2rem;
	}
	.mv .right_ttl .big .num{
		font-size: 4.6rem;
		text-shadow: 0.2rem 0.2rem 0 #000;
	}

	.mv .right_ttl::before{
		bottom: 0.7rem;
		border-top: 1.1rem solid #000;
		border-right: 0.65rem solid transparent;
		border-left: 0.65rem solid transparent;
	}

	.mv .right_box .movie{
		margin-left: auto;
		margin-right: 0.3rem;
		width: 29.7rem;
		height: 19.6rem;
		margin-top: -2.1rem;
	}

	.info{
		flex-direction: column;
		align-items: flex-start;
		margin-left: 1rem;
		margin-top: 5.0rem;
	}

	.info .txt_box{
		width: 30.0rem;
		padding: 4rem 2rem 4.5rem;
	}

	.info .txt_box .logo{
		width: 14.0rem;
		margin-bottom: 2rem;
	}

	.info .txt_box .txt{
		line-height: 1.8;
	}

	.info_list{
		margin-left: 0;
		margin-top: 5.2rem;
		width: 30.0rem;
		min-width: 0;
	}

	.info_list li{
		padding: 1rem 0 1rem;
		border-radius: 1rem;
	}
	.info_list li + li{
		margin-top: 2.3rem;
	}

	.info_list li .num{
		width: 5.5rem;
		font-size: 4.1rem;
		text-stroke: 0.2rem #000;
		-webkit-text-stroke: 0.2rem #000;
	}

	.info_list li .ttl{
		font-size: 1.8rem;
	}

	.info_list li .txt{
		font-size: 1.2rem;
	}
}



/* ------------------------------
	.mv.fade-in
------------------------------ */
.mv .logo_box,
.mv .mv_box,
.mv .movie,
.mv .right_ttl_box,
.mv .mv_nav{
	opacity: 0;
	visibility: hidden;
}
.mv.fade-in .logo_box,
.mv.fade-in .mv_box,
.mv.fade-in .movie,
.mv.fade-in .right_ttl_box,
.mv.fade-in .mv_nav{
	animation: mv_fade 0.6s ease-in-out forwards running;
}

@keyframes mv_fade{
	0%{
		opacity: 0;
		visibility: hidden;
		transform: translateX(3rem);
	}

	25%{
		opacity: 1;
		visibility: visible;
	}

	50%{
		opacity: 1;
		visibility: visible;
		transform: translateX(-0.5rem);
	}

	75%{
		opacity: 1;
		visibility: visible;
		transform: translateX(0.3rem);
	}

	100%{
		opacity: 1;
		visibility: visible;
		transform: translateX(0);
	}
}

.mv.fade-in .mv_box{
	animation-delay: 0.4s;
}
.mv.fade-in .movie{
	animation-delay: 0.8s;
}
.mv.fade-in .right_ttl_box{
	animation-delay: 1.2s;
}
.mv.fade-in .mv_nav{
	animation-delay: 1.6s;
}


@media screen and (max-width: 768px) {
	.mv.fade-in .movie{
		animation-delay: 1.2s;
	}
	.mv.fade-in .right_ttl_box{
		animation-delay: 1.6s;
	}
	.mv.fade-in .mv_nav{
		animation-delay: 0.8s;
	}
}



/* ------------------------------
	.graphic
------------------------------ */
.graphic{
	padding-top: 4.7rem;
	padding-bottom: 10.1rem;
}

.sec_ttl_box{
	position: relative;
	z-index: 2;
	display: flex;
}
.sec_ttl{
	position: relative;
	padding: 1rem 5rem;
	background: #FFF793;
	border-radius: 2rem;
	box-shadow: 0.6rem 0.6rem 0 #000;
	line-height: 1.5;
	font-weight: bold;
	font-size: 3.2rem;
	letter-spacing: 0.1em;
}
.sec_ttl .en{
	display: block;
	padding-top: 0.5rem;
	font-size: 4.2rem;
	line-height: 1;
	letter-spacing: 0;
	text-align: center;
}
.sec_ttl .ttl_txt{
	font-size: 2.2rem;
}
.sec_ttl .en + .ttl_txt{
	display: block;
	padding-bottom: 0.5rem;
	letter-spacing: 0;
	text-align: center;
}

.graphic .wrap{
	position: relative;
}

.graphic .sec_ttl{
	background: #ACF2F8;
}

.sec_box{
	padding: 4rem 0 5rem;
}

.sec_list{
	display: flex;
	flex-wrap: wrap;
	width: 74.3rem;
	margin-bottom: 3.5rem;
}

.sec_list li{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 14.0rem;
	height: 3.6rem;
	margin-right: 1rem;
	border-radius: 2rem;
	border: 0.2rem solid #000;
	font-size: 1.5rem;
}
.sec_list li:nth-child(5n){
	margin-right: 0;
}
.sec_list li:nth-child(n + 6){
	margin-top: 1.4rem;
}

.graphic .box1{
	width: 102.2rem;
	margin-top: -6.4rem;
	margin-left: 10.5rem;
	padding-left: 6.5rem;
	padding-right: 4rem;
}

.graphic .box1 .sec_list{
	margin-left: auto;
}

.graphic .box1 .txt_box{
	padding-right: 16.0rem;
}

.graphic .box2_wrap{
	position: relative;
	margin-top: 5.7rem;
	margin-left: 10.5rem;
	padding-left: 50.5rem;
}

.graphic .box2{
	width: 90.9rem;
	padding-left: 8.5rem;
	padding-right: 7rem;
}

.graphic .box2 .ttl{
	margin-bottom: 2.3rem;
	font-size: 3.5rem;
	font-weight: bold;
	line-height: 1.3;
}

.graphic_slide01{
	position: relative;
	margin-top: -11.4rem;
	margin-left: auto;
	width: 62.9rem;
}
.graphic_slide01 .slick-arrow{
	position: absolute;
	z-index: 3;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 2.2rem;
	height: 4.4rem;
	cursor: pointer;
}
.graphic_slide01 .prev_arrow{
	left: 1.6rem;
	background: url(../img/prev_arw.svg) no-repeat center center;
	background-size: 100%;
}
.graphic_slide01 .next_arrow{
	right: 1.6rem;
	background: url(../img/next_arw.svg) no-repeat center center;
	background-size: 100%;
}

.graphic .box2_wrap{
	position: relative;
}

.graphic_slide02{
	position: absolute;
	top: -9.3rem;
	left: 0;
	width: 53.9rem;
}

.btn{
	display: flex;
}
.btn.center{
	justify-content: center;
}
.btn.right{
	justify-content: flex-end;
}

.btn a{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 54.9rem;
	height: 6.9rem;
	padding-right: 3rem;
	background: #FFF793 url(../img/ico_win01.svg) no-repeat;
	background-size: 2.5rem;
	background-position: calc(100% - 3rem) center;
	border-radius: 2rem;
	text-align: center;
	font-size: 2.4rem;
	line-height: 1.5;
	font-weight: bold;
	-webkit-transition: transform .4s ease;
	transition: transform 0.4s;
}
@media screen and (min-width: 769px) {
	.btn a:hover{
		opacity: 1;
		transform: scale(1.08);
	}
}
.btn.blue a{
	background-color: #CDF7FA;
}
.btn.green a{
	background-color: #CCFFD6;
}
.btn.pink a{
	background-color: #FDDADC;
}
.btn.nowin a{
	padding: 0;
	background: #FFF793;
}

.graphic .btn{
	position: relative;
	z-index: 3;
	margin-top: -3.3rem;
}


@media screen and (max-width: 1000px) {
	.graphic .box1{
		width: 122.2rem;
	}
	.graphic .box2{
		width: 110.9rem;
	}

	.graphic .box1 .txt_box{
		padding-right: 0;
	}
	.graphic_slide01{
		position: relative;
		margin-top: -3.4rem;
		margin-left: auto;
	}

	.sec_list{
		width: 94.3rem;
	}

	.sec_list li{
		width: 18.0rem;
	}
}


@media screen and (max-width: 768px) {
	.graphic{
		padding-top: 1.7rem;
		padding-bottom: 7.7rem;
	}

	.sec_ttl{
		padding: 1rem 3rem;
		border-radius: 1rem;
		box-shadow: 0.3rem 0.3rem 0 #000;
		font-size: 1.9rem;
	}
	.sec_ttl .en{
		padding: 0;
		font-size: 2.6rem;
	}
	.sec_ttl .ttl_txt{
		font-size: 1.3rem;
	}
	.sec_ttl .en + .ttl_txt{
		padding: 0;
	}

	.sec_box{
		padding: 5rem 0 6rem;
	}

	.sec_list{
		width: 100%;
		margin-bottom: 2rem;
	}

	.sec_list li{
		width: calc((100% - 1.4rem) / 3);
		height: 2.4rem;
		margin-right: 0.7rem;
		border: 0.1rem solid #000;
		font-size: 1.0rem;
	}
	.sec_list li:nth-child(5n){
		margin-right: 0.7rem;
	}
	.sec_list li:nth-child(3n){
		margin-right: 0;
	}
	.sec_list li:nth-child(n + 4),
	.sec_list li:nth-child(n + 6){
		margin-top: 1.4rem;
	}

	.graphic .box1 .txt_box{
		padding-right: 0;
	}

	.graphic .box2_wrap{
		margin-top: 4.9rem;
		margin-left: 0;
		padding-left: 0;
	}

	.content .graphic .box2{
		margin-top: 0;
		padding-top: 3rem;
	}
	.graphic .box2 .ttl{
		margin-bottom: 2rem;
		font-size: 2.0rem;
		line-height: 1.5;
	}

	.graphic_slide01{
		margin-top: -2.7rem;
		margin-left: 0;
		width: 30.5rem;
	}

	.graphic .box2_wrap{
		position: relative;
	}

	.graphic_slide02{
		position: relative;
		top: 0;
		left: 0;
		margin-top: -2.7rem;
		margin-left: 0;
		width: 30.5rem;
	}

	.btn a{
		width: 29.7rem;
		height: 4rem;
		padding-right: 2rem;
		background-size: 1.4rem;
		background-position: calc(100% - 1rem) center;
		border-radius: 1rem;
		font-size: 1.4rem;
	}

	.graphic .btn{
		margin-top: 2.3rem;
		margin-right: 0.8rem;
	}
}



/* ------------------------------
	.web
------------------------------ */
.web{
	padding-top: 4.7rem;
	padding-bottom: 14.1rem;
}

.web .sec_ttl{
	background: #FFD76C;
}

.web .sec_box{
	width: 98.9rem;
	margin-top: -6.4rem;
	margin-left: 10.5rem;
	padding-left: 6.5rem;
	padding-right: 4rem;
}

.web .sec_box .txt_box{
	padding-bottom: 7.0rem;
}

.web .sec_list{
	width: 77.2rem;
	margin-left: auto;
}
.web .sec_list li{
	width: 18.4rem;
}
.web .sec_list li:nth-child(5n){
	margin-right: 1rem;
}
.web .sec_list li:nth-child(4n){
	margin-right: 0;
}
.web .sec_list li:nth-child(n + 5){
	margin-top: 1.4rem;
}

.web_slide_box{
	position: relative;
	margin-top: -6.8rem;
}

.web_slide{
	width: 144.9rem;
	margin-left: auto;
	margin-right: 2.1rem;
}

.web_slide .slick-track{
	padding-bottom: 1rem;
}

.web_slide .img{
	width: 47.4rem;
	margin-right: 0.9rem;
}

.web_slide_box .ttl{
	position: absolute;
	z-index: 3;
	top: -11.5rem;
	right: -3rem;
	padding: 2.5rem 4rem;
	border-radius: 2rem;
	background: #FCE7AD;
	font-size: 2.6rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.5;
}


@media screen and (max-width: 1200px) {
	.web .sec_box{
		width: 112.7rem;
	}

	.web .sec_list{
		width: 91.0rem;
	}

	.web .sec_list li{
		width: 22.0rem;
	}
}


@media screen and (max-width: 1000px) {
	.web .sec_box{
		width: 132rem;
	}

	.web .sec_box .txt_box{
		padding-bottom: 5rem;
		padding-right: 20rem;
	}

	.web .sec_list{
		width: 115.0rem;
	}

	.web .sec_list li{
		width: 28.0rem;
	}

	.web_slide_box{
		position: relative;
	}
}


@media screen and (max-width: 768px) {
	.web{
		padding-top: 1.7rem;
		padding-bottom: 7.6rem;
	}

	.web .sec_list{
		width: 100%;
	}
	.web .sec_list li{
		width: calc(50% - 0.4rem);
		height: 2.4rem;
		margin-right: 0.8rem;
		border: 0.1rem solid #000;
		font-size: 1.0rem;
	}
	.web .sec_list li:nth-child(5n){
		margin-right: 0.8rem;
	}
	.web .sec_list li:nth-child(even){
		margin-right: 0;
	}
	.web .sec_list li:nth-child(n + 3){
		margin-top: 1rem;
	}

	.web .sec_box .txt_box{
		padding: 0;
	}

	.web_slide_box{
		margin-top: -4rem;
		text-align: right;
	}

	.web_slide{
		position: relative;
		top: 0;
		left: 0;
		margin-left: 0;
		width: 28.1rem;
		height: 48.6rem;
	}
	.web_slide .img{
		width: 27.8rem;
		border: 0.3rem solid #000;
		margin-right: 0.3rem;
		margin-bottom: 0.3rem;
	}

	.web_slide_sp{
		position: relative;
		top: 0;
		left: 0;
		margin-left: 0;
		width: 28.1rem;
		height: 48.6rem;
	}

	.web_slide_box .ttl{
		position: relative;
		top: 0;
		right: 0;
		display: inline-block;
		padding: 1rem 1.5rem;
		margin-top: -1.7rem;
		margin-right: 1.4rem;
		border-radius: 1rem;
		font-size: 1.4rem;
	}
}



/* ------------------------------
	.video
------------------------------ */
.video{
	padding-top: 4.7rem;
	padding-bottom: 2.4rem;
}

.video .sec_ttl{
	background: #FFC6E2;
}

.video .sec_box{
	width: 98.9rem;
	margin-top: -6.4rem;
	margin-left: 10.5rem;
	padding-left: 6.5rem;
	padding-right: 4rem;
}

.video .sec_box .sec_list{
	margin-left: auto;
}

.video .sec_box .txt_box{
	padding-right: 9rem;
}

.movie{
	position: relative;
	width: 62.9rem;
	height: 35.8rem;
	pointer-events: none;
	overflow: hidden;
}
.movie video{
	position: absolute;
	top: 0;
	left: 0;
	margin: auto;
	width: 100%;
	height: 100%;
	border: 0;
	object-fit: cover;
	pointer-events: none;
}
.movie iframe{
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 50%;
	height: auto;
	min-height: 100%;
	min-width: 100%;
	-ms-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	overflow: hidden;
	object-fit: cover;
	border: 0;
	pointer-events: none;
}

.video .movie{
	margin-top: -20.5rem;
	margin-left: auto;
}


@media screen and (max-width: 1000px) {
	.video .sec_box{
		width: 118.9rem;
		padding-bottom: 10rem;
	}

	.video .sec_box .txt_box{
		padding-right: 0;
	}

	.video .movie{
		margin-top: -8rem;
	}
}


@media screen and (max-width: 768px) {
	.video{
		padding-top: 1.7rem;
		padding-bottom: 7.6rem;
	}

	.movie{
		width: 30.5rem;
		height: 17.5rem;
	}

	.video .sec_box{
		padding-bottom: 6rem;
	}

	.video .movie{
		margin-top: -2.7rem;
		margin-left: 0;
	}
}



/* ------------------------------
	.studio
------------------------------ */
.studio{
	padding-top: 4.7rem;
	padding-bottom: 14.2rem;
}

.studio .wrap{
	position: relative;
}

.studio .sec_ttl{
	background: #9DFAAF;
	margin-left: 44rem;
}

.studio .sec_box{
	width: 99.9rem;
	margin-top: -6.4rem;
	margin-left: auto;
	margin-right: 5rem;
	padding-left: 13.0rem;
	padding-right: 4rem;
}

.studio .sec_box .sec_list{
	margin-left: auto;
}

.studio_box{
	display: flex;
	align-items: center;
	margin: 1.5rem 0 0.5rem;
}

.studio_box .ttl{
	flex-shrink: 0;
	display: flex;

	align-items: center;
	justify-content: center;
	padding: 0.5rem 2.5rem;
	margin-right: 1.8rem;
	border: 0.2rem solid #000;
	border-radius: 1rem;
	text-align: center;
	font-weight: bold;
	font-size: 1.8rem;
	line-height: 1.5;
}

.studio_box .txt{
	font-size: 2.8rem;
	font-weight: bold;
	line-height: 1.5;
}
.studio_box .txt .big{
	margin-right: 0.3em;
	font-size: 4.0rem;
}

.studio .txt.min{
	font-size: 1.4rem;
}

.studio .movie{
	margin-top: -24.2rem;
}

.studio .btn{
	position: absolute;
	right: 0;
	bottom: 7.5rem;
}


@media screen and (max-width: 1000px) {
	.studio .sec_ttl{
		background: #9DFAAF;
		margin-left: 19rem;
	}

	.studio .sec_box{
		width: 119.9rem;
		padding-left: 6rem;
		padding-bottom: 10rem;
	}

	.studio .sec_box .txt_box{
		padding-left: 0;
	}

	.studio .movie{
		margin-top: -8rem;
	}

	.studio .btn{
		bottom: 23.5rem;
	}
}


@media screen and (max-width: 768px) {
	.studio{
		padding-top: 1.7rem;
		padding-bottom: 7.7rem;
	}

	.studio .sec_ttl{
		margin-left: 0;
	}

	.content .sec_box{
		width: calc(100% - 3.2rem);
		margin-right: 0.3rem;
		margin-top: -3rem;
		margin-left: auto;
		padding-left: 2rem;
		padding-right: 2rem;
	}

	.studio .sec_box{
		padding-bottom: 6rem;
	}

	.studio_box{
		margin: 2rem 0 1rem;
	}

	.studio_box .ttl{
		padding: 0.3rem 1.5rem;
		margin-right: 1.1rem;
		border: 0.1rem solid #000;
		border-radius: 0.8rem;
		font-size: 1.3rem;
	}

	.studio_box .txt{
		font-size: 1.8rem;
	}
	.studio_box .txt .big{
		font-size: 3.0rem;
		line-height: 1;
	}

	.studio .txt.min{
		font-size: 1.2rem;
	}

	.studio .movie{
		margin-top: -2.7rem;
	}

	.studio .btn{
		position: relative;
		bottom: 0;
		margin-top: 2.3rem;
		justify-content: flex-end;
		margin-right: 1rem;
	}
}



/* ------------------------------
	.works
------------------------------ */
.works{
	padding-top: 4.7rem;
	padding-bottom: 14.0rem;
}

.works .sec_ttl{
	margin-bottom: 5.1rem;
}

.works_list{
	display: flex;
	flex-wrap: wrap;
}
.works_list li{
	width: calc((100% - 10.6rem) / 3);
	margin-right: 5.3rem;
}
.works_list li:nth-child(3n){
	margin-right: 0;
}
.works_list li:nth-child(n + 4){
	margin-top: 4.7rem;
}

.works_list li .img{
	position: relative;
	width: 100%;
	padding-top: 65%;
}
.works_list li .img img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.works_list .txt_box{
	padding: 3rem 3.5rem;
	border-top: 0.6rem solid #000;
}

.works_list .cate{
	display: inline-block;
	min-width: 14.0rem;
	padding: 0.8rem 1rem;
	margin-bottom: 2rem;
	background: #FCE7AD;
	border-radius: 2rem;
	border: 0.2rem solid #000;
	font-size: 1.5rem;
	text-align: center;
}
.works_list .cate.blue{
	background: #CDF7FA;
}
.works_list .cate.pink{
	background: #FFE6F3;
}

.works_list .works_box{
	display: flex;
	align-items: flex-start;
}
.works_list .works_box + .works_box{
	margin-top: 1rem;
}

.works_list .works_box .ttl{
	flex-shrink: 0;
	position: relative;
	width: 10.5rem;
	margin-right: 1.2rem;
	margin-top: 0.7rem;
	font-size: 1.6rem;
}
.works_list .works_box .ttl::before{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background: #000;
}
.works_list .works_box .ttl .en{
	position: relative;
	z-index: 2;
	display: inline-block;
	background: #fff;
	padding-right: 1.2rem;
	font-weight: 500;
}

.works_list .works_box .txt{
	font-weight: bold;
	font-size: 2.1rem;
	line-height: 1.6;
}
.works_list .works_box .txt.num{
	font-weight: 600;
}


@media screen and (max-width: 768px) {
	.works{
		padding-top: 1.7rem;
		padding-bottom: 7.3rem;
	}

	.works .sec_ttl{
		margin-bottom: 3.3rem;
	}

	.works_list{
		flex-direction: column;
		margin-left: 1.1rem;
	}
	.works_list li{
		width: 29.3rem;
		margin-right: 0;
	}
	.works_list li + li,
	.works_list li:nth-child(n + 4){
		margin-top: 2.3rem;
	}

	.works_list .txt_box{
		padding: 1.5rem 1.8rem 2rem;
		border-top: 0.3rem solid #000;
	}

	.works_list .cate{
		min-width: 8.2rem;
		padding: 0.5rem 0.5rem;
		margin-bottom: 2rem;
		border: 0.1rem solid #000;
		font-size: 1.1rem;
	}

	.works_list .works_box + .works_box{
		margin-top: 0.8rem;
	}

	.works_list .works_box .ttl{
		width: 7rem;
		margin-right: 1rem;
		margin-top: 0.5rem;
		font-size: 1.0rem;
	}
	.works_list .works_box .ttl .en{
		padding-right: 1rem;
	}

	.works_list .works_box .txt{
		font-size: 1.3rem;
	}

	.works_list_btn{
		position: relative;
		margin-top: 3.5rem;
		padding-bottom: 2.5rem;
		text-align: center;
		font-size: 1.5rem;
		font-weight: 600;
	}
	.works_list_btn:before{
		content: "View More";
	}
	.works_list_btn.open:before{
		content: "Close";
	}
	.works_list_btn::after{
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		content: "";
		display: block;
		width: 0;
		height: 0;
		border-top: 1.0rem solid #000;
		border-right: 0.8rem solid transparent;
		border-left: 0.8rem solid transparent;
	}
	.works_list_btn.open::after{
		transform: rotate(-180deg);
	}
}



/* ------------------------------
	.partner
------------------------------ */
.partner{
	padding-top: 4.7rem;
	padding-bottom: 14.2rem;
}

.partner_wrap{
	width: calc(100% - 6.4rem);
	margin-top: -3.5rem;
	margin-left: auto;
	padding: 9rem 7rem 8rem 8rem;
}

.partner_box{
	width: 42.0rem;
}
.partner_box + .partner_box{
	margin-top: 5.5rem;
}

.partner_box .ttl{
	padding-bottom: 0.2em;
	border-bottom: 0.2rem solid #000;
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 1.5;
}

.partner_list{
	padding-top: 2rem;
}
.partner_list li{
	line-height: 1.6;
	font-size: 1.6rem;
}
.partner_list li + li{
	margin-top: 0.7rem;
}


@media screen and (max-width: 768px) {
	.partner{
		padding-top: 1.7rem;
		padding-bottom: 7.6rem;
	}

	.partner_wrap{
		width: 29.4rem;
		margin-top: -2.7rem;
		margin-left: 1.1rem;
		padding: 6rem 2rem;
	}

	.partner .flex{
		flex-direction: column;
	}

	.partner_box{
		width: 100%;
	}
	.partner_box + .partner_box,
	.flex_box + .flex_box{
		margin-top: 2.4rem;
	}

	.partner_box .ttl{
		position: relative;
		border-bottom: 0.1rem solid #000;
		font-size: 1.6rem;
		cursor: pointer;
	}
	.partner_box .ttl::before{
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		content: "";
		display: block;
		width: 0;
		height: 0;
		border-top: 1.0rem solid #000;
		border-right: 0.8rem solid transparent;
		border-left: 0.8rem solid transparent;
	}
	.partner_box .ttl.open::before{
		transform: rotate(-180deg);
	}

	.partner_list{
		display: none;
		padding-top: 1.5rem;
	}
	.partner_list li{
		font-size: 1.4rem;
	}
	.partner_list li + li{
		margin-top: 0.2rem;
	}
}



/* ------------------------------
	.note
------------------------------ */
.note{
	padding-top: 4.7rem;
	padding-bottom: 10.1rem;
}

.note .sec_ttl{
	margin-bottom: 5.1rem;
}

.note_list{
	display: flex;
	flex-wrap: wrap;
}
.note_list li{
	width: calc((100% - 12.6rem) / 4);
	margin-right: 4.2rem;
}
.note_list li:nth-child(4n){
	margin-right: 0;
}
.note_list li:nth-child(n + 5){
	margin-top: 4.7rem;
}

.note_list li a{
	display: block;
	width: 100%;
	-webkit-transition: transform .4s ease;
	transition: transform 0.4s;
}
@media screen and (min-width: 769px) {
	.note_list li a:hover{
		opacity: 1;
		transform: scale(1.08);
	}
}

.note_list li .img{
	position: relative;
	width: 100%;
	padding-top: 53%;
}
.note_list li .img img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.note_list .txt_box{
	padding: 2rem 2rem 3rem;
	border-top: 0.6rem solid #000;
}

.note_list .txt_box .date{
	margin-bottom: 1.5rem;
	text-align: right;
	font-size: 2.1rem;
	font-weight: bold;
	text-align: right;
	color: #9F9F9F;
}

.note_list .txt_box .txt{
	display: -webkit-box;
	overflow: hidden;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	font-weight: bold;
	line-height: 1.6;
	min-height: 3.2em;
}

.note .btn{
	margin-top: 5.7rem;
}


@media screen and (max-width: 768px) {
	.note{
		padding-top: 1.7rem;
		padding-bottom: 6.7rem;
	}

	.note .sec_ttl{
		margin-bottom: 3.3rem;
	}

	.note_list{
		flex-direction: column;
		margin-left: 1.1rem;
	}
	.note_list li{
		width: 29.3rem;
		margin-right: 0;
	}
	.note_list li + li,
	.note_list li:nth-child(n + 5){
		margin-top: 2.3rem;
	}

	.note_list .txt_box{
		padding: 1.5rem 1.8rem 2rem;
		border-top: 0.3rem solid #000;
	}

	.note_list .txt_box .date{
		margin-bottom: 1rem;
		font-size: 1.4rem;
	}

	.note_list .txt_box .txt{
		font-size: 1.6rem;
	}

	.note .btn{
		margin-top: 3.3rem;
		justify-content: center;
	}
}



/* ------------------------------
	.company
------------------------------ */
.company{
	padding-top: 4.7rem;
	padding-bottom: 14.1rem;
}

.company .sec_ttl{
	margin-bottom: 5.1rem;
}

.company .wrap{
	position: relative;
}

.company .logo_box01{
	width: 49rem;
	padding: 5rem 6rem;
	margin-left: 6.4rem;
}
.company .logo_box01 .logo{
	width: 36rem;
	margin-bottom: 1rem;
}
.company .logo_box01 .logo img{
	width: 100%;
}

.company .logo_box01 .txt{
	font-size: 2.6rem;
	font-weight: bold;
	line-height: 1.6;
}
.company .logo_box01 .txt .map{
	text-decoration: underline;
	-webkit-transition: color .4s ease;
	transition: color .4s ease;
}
@media screen and (min-width: 769px) {
	.company .logo_box01 .txt .map:hover{
		opacity: 1;
		color: #FFF13C;
	}
}

.company .logo_box02{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 36.5rem;
	height: 16.9rem;
	margin-left: 48rem;
	margin-top: -12.6rem;
}
.company .logo_box02 .logo{
	width: 24.2rem;
	margin-top: 1rem;
}
.company .logo_box02 .txt{
	line-height: 1.6;
	font-weight: bold;
}

.company .access{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-left: 13rem;
	margin-top: 2rem;
}

.company .access .access_ttl{
	position: relative;
	padding: 0.5rem 3rem;
	margin-bottom: -2rem;
	font-size: 2.2rem;
	font-weight: bold;
	border-radius: 1.5rem;
	line-height: 1.5;
	box-shadow: 0.4rem 0.4rem 0 #000;
}

.company .access_box{
	padding: 4rem;
	margin-left: 6rem;
}

.company .access_box .ttl{
	font-size: 2.0rem;
	font-weight: bold;
	line-height: 1.8;
}
.company .access_box .txt{
	padding-left: 1em;
	font-weight: bold;
	line-height: 1.8;
}

.company .btn_box{
	margin-right: 31rem;
	margin-top: -13.7rem;
}
.company .btn_box .btn + .btn{
	margin-top: 3.2rem;
}

.company .movie{
	position: absolute;
	top: 16.8rem;
	right: 6rem;
	width: 64rem;
	height: 48rem;
}


@media screen and (max-width: 768px) {
	.company{
		padding-top: 1.7rem;
		padding-bottom: 7.7rem;
	}

	.company .sec_ttl{
		margin-bottom: 3.3rem;
	}


	.company .logo_box01{
		width: 25.4rem;
		padding: 3rem 3rem 5rem;
		margin-left: 1.1rem;
	}
	.company .logo_box01 .logo{
		width: 18rem;
	}

	.company .logo_box01 .txt{
		font-size: 1.5rem;
	}

	.company .logo_box02{
		width: 20rem;
		height: 9.3rem;
		margin-left: 9.8rem;
		margin-top: -2.7rem;
	}
	.company .logo_box02 .logo{
		width: 13.9rem;
		margin-top: 1rem;
	}
	.company .logo_box02 .txt{
		font-size: 1.2rem;
	}

	.company .access{
		margin-left: 2.5rem;
		margin-top: 2.3rem;
	}

	.company .access .access_ttl{
		padding: 0.5rem 1.5rem;
		margin-bottom: -1.8rem;
		font-size: 1.4rem;
		border-radius: 1rem;
		box-shadow: 0.3rem 0.3rem 0 #000;
	}

	.company .access_box{
		padding: 3rem 2rem 2.5rem;
		margin-left: 3rem;
	}

	.company .access_box .ttl{
		font-size: 1.3rem;
	}
	.company .access_box .txt{
		font-size: 1.3rem;
	}

	.company .movie{
		position: relative;
		top: 0;
		right: 0;
		width: 25.2rem;
		height: 19rem;
		margin-top: 4.3rem;
	}

	.company .btn_box{
		margin-right: 1.1rem;
		margin-top: 3.3rem;
	}
	.company .btn_box .btn + .btn{
		margin-top: 2rem;
	}
}



/* ------------------------------
	.contact
------------------------------ */
.contact{
	padding-top: 4.7rem;
}

.contact .sec_ttl_box{
	align-items: center;
	margin-bottom: 7rem;
}

.contact .sec_ttl_box .txt{
	margin-left: 4.6rem;
	font-size: 2.6rem;
	font-weight: bold;
}

.contact_form{
	width: calc(100% - 13rem);
	padding: 7rem 27rem 12rem 18rem;
	margin: 0 auto;
}

.cp_box{
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 100%;
	height: 22rem;
	padding-left: 24.6rem;
	margin-bottom: 6rem;
}

.cp_box .cp_left{
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 22rem;
	height: 22rem;
	background: #FFF793;
	border-radius: 50%;
	text-align: center;
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 1.5;
}

.cp_box .cp_ttl{
	margin-bottom: 1.5rem;
	font-size: 3.6rem;
	font-weight: bold;
	line-height: 1.5;
}

.cp_box .cp_txt{
	font-size: 2.2rem;
	font-weight: bold;
	line-height: 1.8;
	letter-spacing: 0.05em;
}

.txt_red{
	color: #B9000C;
}

.contact_form .txt{
	margin-bottom: 3rem;
	font-size: 1.8rem;
	line-height: 1.8;
}

.contact_box{
	display: flex;
	align-items: flex-start;
}
.contact_box + .contact_box{
	margin-top: 6.4rem;
}

.contact_box .contact_ttl{
	flex-shrink: 0;
	width: 25rem;
	padding: 1rem 0 0;
	font-size: 2.2rem;
	line-height: 1.3;
}

.contact_box .contact_txt{
	width: 100%;
}
.contact_box .contact_txt,
.contact_box .contact_txt *{
	line-height: 1.5;
}

.contact_form .form_input,
.contact_form .form_select,
.contact_form .form_textarea{
	width: 100%;
	height: 5rem;
	padding: 0 3rem;
	background: #fff;
	border: 0.2rem solid #000;
	border-radius: 0.5rem;
}

.contact_form .form_select{
	padding-right: 6rem;
	background: #fff url(../img/select_arw.svg) no-repeat;
	background-size: 2.4rem;
	background-position: calc(100% - 3rem) center;
}

.contact_form .form_textarea{
	width: 100%;
	height: 27rem;
	padding: 2rem 3rem;
}

.contact_form .btn_box{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 8rem;
}

.contact_form .form_btn{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 39.4rem;
	height: 7.9rem;
	background: #FFF793;
	border-radius: 2rem;
	box-shadow: 0.6rem 0.6rem 0 #000;
	text-align: center;
	font-size: 3.2rem;
	font-weight: bold;
	line-height: 1.3;
	letter-spacing: 0.3em;
	-webkit-transition: transform .4s ease;
	transition: transform 0.4s;
}
@media screen and (min-width: 769px) {
	.contact_form .form_btn:hover {
		opacity: 1;
		transform: scale(1.08);
	}
}
.contact_form .form_btn.back{
	background: #CCFFD6;
}

.contact_form .btn_box .form_btn + .form_btn{
	margin-left: 4rem;
}

.contact_box .contact_txt p.error{
	padding: 0.5rem 0 0;
	font-size: 1.8rem;
	color: #B9000C;
}


@media screen and (max-width: 768px) {
	.contact{
		padding-top: 1.7rem;
	}

	.contact .sec_ttl_box{
		flex-direction: column;
		align-items: flex-start;
		margin-bottom: 2rem;
	}

	.contact .sec_ttl_box .txt{
		margin-left: 0;
		margin-top: 2rem;
		margin-left: 1.1rem;
		font-size: 1.4rem;
	}

	.contact_form{
		width: 29.3rem;
		padding: 3rem 1.8rem 6rem;
		margin-left: 1.1rem;
	}

	.cp_box{
		height: auto;
		padding-left: 0;
		margin-bottom: 4rem;
	}

	.cp_box .cp_ttl_box{
		display: flex;
		align-items: center;
		margin-bottom: 2rem;
	}

	.cp_box .cp_left{
		position: relative;
		flex-shrink: 0;
		width: 11rem;
		height: 11rem;
		font-size: 1.3rem;
	}

	.cp_box .cp_ttl{
		margin-bottom: 0;
		margin-left: 1.2rem;
		font-size: 1.9rem;
		white-space: nowrap;
	}

	.cp_box .cp_txt{
		font-size: 1.5rem;
	}

	.contact_form .txt{
		font-size: 1.4rem;
	}

	.contact_box{
		flex-direction: column;
	}
	.contact_box + .contact_box{
		margin-top: 3rem;
	}

	.contact_box .contact_ttl{
		width: 100%;
		padding: 0 0 1rem;
		font-size: 1.5rem;
	}

	.contact_form .form_input,
	.contact_form .form_select,
	.contact_form .form_textarea{
		height: 4rem;
		padding: 0 1rem;
	}

	.contact_form .form_select{
		padding-right: 3rem;
		background: #fff url(../img/select_arw_sp.svg) no-repeat;
		background-size: 1.4rem;
		background-position: calc(100% - 1rem) center;
	}

	.contact_form .form_textarea{
		height: 27rem;
		padding: 1rem 1rem;
	}

	.contact_form .btn_box{
		margin-top: 5rem;
	}
	.contact_form .btn_box .form_btn + .form_btn{
		margin-left: 1.5rem;
	}

	.contact_form .form_btn{
		width: 12.9rem;
		height: 4.4rem;
		border-radius: 1rem;
		box-shadow: 0.3rem 0.3rem 0 #000;
		font-size: 1.9rem;
	}

	.contact_box .contact_txt p.error{
		padding: 0.5rem 0 0;
		font-size: 1.4rem;
	}
}



/* ------------------------------
	.contact.confirm
------------------------------ */
.contact.confirm .contact_box .contact_ttl{
	padding-top: 0;
}

.contact.confirm .contact_box .contact_txt,
.contact.confirm .contact_box .contact_txt *{
	line-height: 1.6;
	word-break: break-all;
}


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



/* ------------------------------
	.contact.thanks
------------------------------ */
.thanks_box{
	margin-bottom: 6rem;
}

.thanks_box .thanks_ttl{
	margin-bottom: 3rem;
	font-size: 3.6rem;
	font-weight: bold;
	line-height: 1.5;
}

.thanks_box .thanks_txt{
	font-size: 2.2rem;
	font-weight: bold;
	line-height: 1.8;
}
.thanks_box .thanks_txt + .thanks_txt{
	margin-top: 1.5rem;
}


@media screen and (max-width: 768px) {
	.thanks_box{
		margin-bottom: 4rem;
	}

	.thanks_box .thanks_ttl{
		margin-bottom: 2rem;
		font-size: 1.9rem;
	}

	.thanks_box .thanks_txt{
		font-size: 1.5rem;
	}
}



/* ------------------------------
	sec.fade-in
------------------------------ */
@keyframes sec_fade{
	0%{
		opacity: 0;
		visibility: hidden;
		transform: translateY(5rem);
	}

	25%{
		opacity: 1;
		visibility: visible;
	}

	100%{
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}
}

.graphic .sec_ttl,
.graphic .box1_wrap .sec_box,
.graphic .graphic_slide01,
.graphic .graphic_slide02,
.graphic .box2_wrap .sec_box,
.graphic .graphic_slide01,
.graphic .btn{
	opacity: 0;
	visibility: hidden;
}
.graphic.fade-in .sec_ttl,
.graphic.fade-in .box1_wrap .sec_box,
.graphic.fade-in .graphic_slide01,
.graphic.fade-in .graphic_slide02,
.graphic.fade-in .box2_wrap .sec_box,
.graphic.fade-in .graphic_slide01,
.graphic.fade-in .btn{
	animation: sec_fade 0.3s ease-in-out forwards running;
}
.graphic.fade-in .box1_wrap .sec_box{
	animation-delay: 0.3s;
}
.graphic.fade-in .graphic_slide01{
	animation-delay: 0.6s;
}
.graphic.fade-in .graphic_slide02{
	animation-delay: 0.9s;
}
.graphic.fade-in .box2_wrap .sec_box,
.graphic.fade-in .btn{
	animation-delay: 1.2s;
}

.web .sec_ttl,
.web .sec_box,
.web .web_slide,
.web .web_slide_sp,
.web .ttl{
	opacity: 0;
	visibility: hidden;
}
.web.fade-in .sec_ttl,
.web.fade-in .sec_box,
.web.fade-in .web_slide,
.web.fade-in .web_slide_sp,
.web.fade-in .ttl{
	animation: sec_fade 0.3s ease-in-out forwards running;
}
.web.fade-in .sec_box{
	animation-delay: 0.3s;
}
.web.fade-in .web_slide,
.web.fade-in .web_slide_sp{
	animation-delay: 0.6s;
}
.web.fade-in .ttl{
	animation-delay: 0.9s;
}

.video .sec_ttl,
.video .sec_box,
.video .movie{
	opacity: 0;
	visibility: hidden;
}
.video.fade-in .sec_ttl,
.video.fade-in .sec_box,
.video.fade-in .movie{
	animation: sec_fade 0.3s ease-in-out forwards running;
}
.video.fade-in .sec_box{
	animation-delay: 0.3s;
}
.video.fade-in .movie{
	animation-delay: 0.6s;
}

.studio .sec_ttl,
.studio .sec_box,
.studio .movie,
.studio .btn{
	opacity: 0;
	visibility: hidden;
}
.studio.fade-in .sec_ttl,
.studio.fade-in .sec_box,
.studio.fade-in .movie,
.studio.fade-in .btn{
	animation: sec_fade 0.3s ease-in-out forwards running;
}
.studio.fade-in .sec_box,
.studio.fade-in .btn{
	animation-delay: 0.3s;
}
.studio.fade-in .movie{
	animation-delay: 0.6s;
}




@media screen and (max-width: 768px) {
	.graphic.fade-in .box2_wrap .sec_box{
		animation-delay: 0.9s;
	}
	.graphic.fade-in .graphic_slide02{
		animation-delay: 1.2s;
	}
	.graphic.fade-in .btn{
		animation-delay: 1.5s;
	}

	.studio.fade-in .movie{
		animation-delay: 0.6s;
	}
	.studio.fade-in .btn{
		animation-delay: 0.9s;
	}
}