@charset "utf-8";
/* CSS Document */
/*********************************************
 
	common style 
 
*********************************************/

@font-face {
font-family: ‘Noto Sans Japanese’;
font-style: normal;
font-weight: 300;
src: url('font/NotoSansCJKjp-DemiLight.eot');
src: url('font/NotoSansCJKjp-DemiLight.eot?#iefix') format('embedded-opentype'),
url('font/NotoSansCJKjp-DemiLight.woff') format('woff'),
url('font/NotoSansCJKjp-DemiLight') format('truetype');
}

body {
	color: #1a1a1a;
	line-height: 1;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	-webkit-font-smoothing: antialiased;
}

a {
	text-decoration: none;
	color: #1a1a1a;
}

/* clearfix
--------------------------------*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	font-size: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
	overflow: hidden;
}
/* Hides from IE Mac */
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}

/* hover
--------------------------------*/
a:hover {
	opacity:0.5;
	filter:alpha(opacity=50);
	-ms-filter: "alpha( opacity=50 )";
	transition: .7s;
     -webkit-transition: all .7s;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

/* fade-in
--------------------------------*/
.fade-in {
	transition: opacity 0.3s;
	-moz-transition: opacity 0.3s;
	-webkit-transition: opacity 0.3s;
	-o-transition: opacity 0.3s;
	opacity:0;
	filter:alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
}

/* btn
--------------------------------*/
.btn {
	text-align: center;
	width: 100%;
	max-width: 380px;
	position: relative;
}
.btn a {
	display: block;
	padding: 40px 0;
	font-size: 23px;
	color: #ffffff;
	text-align: center;
	border-radius: 50px;
	background-color: #db807d;
     transition: all .5s;
     -webkit-transition: all .5s;
}
.btn a:hover {
	opacity:1;
	filter:alpha(opacity=100);
	background-color: #ce5753;
}
.arrow a::after {
	/*content: '\f0da';
	font-family: "FontAwesome";
	position: absolute;
	right: 10%;
	color: #ffffff;*/
}

/* PC none
--------------------------------*/
.sp-sns {display: none;}
.mv_ttl_sp {display: none;}
.lyrics_btn {display: none;}
.lyrics_box .arrow br {display: none;}
.lyrics_sp {display: none;}
.br{display: none;}





/*********************************************

	topview style

*********************************************/
#loader-bg {
	position: fixed;
	display: none;
	width: 100vw;
	height: 100vh;
	background: #ffffff;
	z-index: 1000;
}
#loader {
	display: none;
	z-index: 1100;
}
.topview {
	max-width: 1200px;
	width: 100vw;
	height: 100vh;
	padding: 10%;
	box-sizing: border-box;
	margin: 0 auto;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap; 
	-webkit-flex-wrap : wrap; 
	justify-content: center;
	align-items: center;
}
.topview .tv_cp {
	flex: 4;
	font-size: 30px;
	font-weight: 500;
	line-height: 2;
	letter-spacing: 0.4em;
}
.topview .tv_img {
	flex: 6;
	max-width: 350px;
}
.topview .tv_img img {
	width: 100%;
}



/*********************************************

	header-area style

*********************************************/
.header-area {
	width: 100%;
}

/* header
--------------------------------*/
.header-area header {
	position: fixed;
	width: 100%;
	z-index: 100;
	top: 0;
	background: rgba(255, 255, 255, .9);
}

/* header-inner
--------------------------------*/
header .header-inner {
	position:relative;
	width: 100%;
	max-width: 1200px;
	margin: 20px auto;
	padding: 0 250px 0 0;
	box-sizing:border-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap; 
	-webkit-flex-wrap : wrap;
}
.header-inner .logo {
	max-width: 100%;
	width: 290px;
	margin: 0 5% 0 0;
}
.header-inner .logo img {
	width: 100%;
}

/* gnavi
--------------------------------*/
.header-inner .gnavi {
	flex-grow:1;
	margin:60px 0 0 0;
}
.header-inner .gnavi ul {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: space-between;
}
.header-inner .gnavi ul li a {
	position: relative;
	display: inline-block;
	font-weight: bold;
}
.header-inner .gnavi ul li a:hover {
	opacity:1;
	filter:alpha(opacity=100);
}
.header-inner .gnavi ul li a span {
	display: inline-block;
	position: relative;
}
.header-inner .gnavi ul li a span::after {
	position: absolute;
	content: '';
	width: 100%;
	height: 6px;
	bottom: -10px;
	left: 0;
	background: #db807d;
	transform: scale(0, 1);
	transform-origin: left top;
	transition: transform .3s;
     -webkit-transition: all .3s;
}
.header-inner .gnavi ul li a:hover span::after {
	transform: scale(1, 1);
}

/* sns
--------------------------------*/
.sns {
	position:absolute;
	top:40px;
	right:0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
}
.sns li {
	width:50px;
	margin:0 15px 0 0;
}
.sns li:last-child {
	margin:0;
}
.sns li img {
	width:100%;
}

/* mv
--------------------------------*/
.header-area .mv {
	padding-top: 140px;
	margin: 0 0 100px 0;
	position:relative;
	overflow: hidden;
 }
.header-area .mv .mv-inner {
	width:100%;
	background-image:url("../images/mv.jpg");
	background-repeat: no-repeat;
	padding-bottom: calc(100%*1210/2500);/* calc(100*ImageHeight/ImageWidth)% */
	background-size: 100% auto;
	background-position: 50% 50%;
}

/* copy
--------------------------------*/
.header-area .copy {
	position:absolute;
	top:32%;
	right:15%;
}
.header-area .copy h1 {
	font-size:28px;
	font-weight: bold;
	letter-spacing:0.5em;
	line-height:2;
	margin: 0 0 80px 0;
}
.header-area .copy .cp-logo span {
	position: relative;
	z-index: 10;
	padding: 0 0 0 2%;
}
.header-area .copy .cp-logo::after {
	content: "";
	display: block;
	width: 700px;
	height: 150px;
	background-color: rgba(255,255,255,.9);
	position: absolute;
	bottom:-3%;
	z-index: 1;
}



/*********************************************

	section h2 style

*********************************************/
section h2 {
	position:absolute;
	top:240px;
	left:0;
}
section h2 img {
	width:115px;
	height: 100%;
}



/*********************************************

	section1 style

*********************************************/
#sample {
	position:relative;
	width:100%;
	max-width:1200px;
	margin: -240px auto 80px;
	padding: 240px 0 0 170px;
	box-sizing: border-box;
}
/******************************

	splist style

******************************/
#sample .splist {
	width:100%;
	max-width:1200px;
	margin:0 0 40px 0;
	box-sizing:border-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: space-between;
}

/* li Default
--------------------------------*/
#sample .splist li {
	width: 500px;
	margin: 0 0 30px 0;
}

/* img */
#sample .splist li .splist-img {
	float: left;
	width: 250px;
	height: 250px;
}
#sample .splist li .splist-img img {
	cursor : pointer;
	width: 100%;
}

/* ttl */
#sample .splist li > h3 {
	float: right;
	width: 250px;
	height: 55px;
	padding: 20px 0 0 20px;
	box-sizing: border-box;
	font-weight: bold;
}
#sample .splist li > h3::before {
	content: "";
	padding: 0 0 0  20px;
	border-left: 7px #d97b7b solid;
	box-sizing: border-box;
}

/* textbox */
#sample .splist li .spbox-text {
	width: 250px;
	height: 195px;
	float: right;
    padding: 20px;
    box-sizing: border-box;
    background-color: #e8bebf;
	font-family: 'Noto Sans Japanese';
}
#sample .splist li .spbox-text h4 {
	padding: 0 0 100px 0;
}

/* spec */
#sample .splist li span {
	display: block;
	color: #ffffff;
	font-size: 14px;
}
#sample .splist li span:first-child {
	margin: 0 0 5px 0;
}


/* li Modal
--------------------------------*/
#sample01,#sample02,#sample03,#sample04 {
	display: none;
}
#sample .sample_mbox {
	position: fixed;
	width: 100%;
	max-width: 1200px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 550;
}
#sample .sample_mbox .mbox-l {
	position: absolute;
	bottom: 0;
	left: 0;	
}
#sample .sample_mbox .mbox-r {
	position: absolute;
	bottom: 0;
	right: 0;
}

/* ttl */
.mbox-l h3,
.mbox-r h3 {
	width: 250px;
	font-weight: bold;
	padding: 20px 0 20px 20px;
	box-sizing: border-box;
	background-color: #ffffff;
}
.mbox-l h3::before,
.mbox-r h3::before {
	content: "";
	padding: 0 0 0  20px;
	border-left: 5px #d97b7b solid;
	box-sizing: border-box;
}

/* textbox */
#sample .mbox-text {
	width: 250px;
    padding: 20px;
    box-sizing: border-box;
    background-color: #e8bebf;
	font-family: 'Noto Sans Japanese';
}
#sample .mbox-text h4 {
	padding: 0 0 100px 0;
}
/* img */
.mbox-img img {
	width: 100%;
}

/* modal_bg */
 .modal_bg {
	cursor : pointer;
	z-index: 500;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 120%;
	background-color: rgba(0,0,0,.3);
}

/* close */
#sample .sample_mbox .modal_close {
	position: absolute;
	top: 20px;
	right: 20px;
	font-size: 30px;
	cursor : pointer;
}


/* price
--------------------------------*/
.price {
	padding: 0 60px 0 0;
	box-sizing:border-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: space-between;	
}
.price .p_table {
	flex-grow: 1;
    margin: 0 60px 0 0;
	font-family: 'Noto Sans Japanese';
}
.price .p_table table{
	width: 100%;
	margin: 0 0 5px 0;
	border: 2px #303030 solid;
	letter-spacing: 0.5em;
}
.price .p_table table caption {
	font-size: 20px;
	margin: 0 0 10px 0;
}
.price .p_table table td {
	width: 50%;
	padding: 8px 35px;
	font-size: 20px;
	text-align: center;
	letter-spacing: 0.3em;
}
.price .p_table table td:first-child {
	border-right: 2px #303030 solid;
}
.price .p_table p{
	letter-spacing: 0.3em;
}



/*********************************************

	section2 style

*********************************************/
.bg_pk {
	width:100%;
	background-color:#e8bebf;
	overflow: hidden;
}
#pr {
	position:relative;
	width:100%;
	max-width:1200px;
	margin:0 auto 0;
	padding:100px 0;
	box-sizing: border-box;
}
.pr-box {
	position: relative;
}
.pr-box h3 {
	width: 100%;
	max-width: 600px;
	margin: 0 0 25px 170px;
}
.pr-box h3 img {
	width: 100%;
}

/* creative
--------------------------------*/
.pr-box .creative .cv_img {
	position: absolute;
	top: -50px;
	right: 40px;
	width: 230px;
	z-index: 50;
}
.pr-box .creative .cv_name {
	position: absolute;
	top: 120px;
	right: 150px;
	width: 230px;
	z-index: 55;
}
.pr-box .creative .cv_img img,
.pr-box .creative .cv_name img{
	width: 100%;
}

/* pr-music
--------------------------------*/
.pr-music {
	margin: 0 0 50px 170px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: space-between;	
}

/* music_box
--------------------------------*/
.music_box {
	width: 100%;
	max-width: 520px;
}
.mv_ttl {
	max-width: 520px;
	margin: 0 0 15px 0;
	padding: 10px 0;
	text-align: center;
	background-color: #db807d;
}
.mv_ttl img {
	max-width: 520px;
	width: 100%;
}
.video {
	max-width: 520px;
	width: 100%;
	height: 300px;
}

/* lyrics_box
--------------------------------*/
.lyrics_box {
	padding: 0 50px 0 0;
	box-sizing: border-box;
}
blockquote {
	max-width: 410px;
	width: 100%;
	height: 160px;
	margin: 90px 0 35px 0;
	padding: 10px;
	line-height: 1.8;
	font-size: 12px;
	font-weight: 500;
	font-family: 'Noto Sans Japanese';
	box-sizing: border-box;
	overflow:scroll;
	overflow-x:hidden;
	direction:rtl;
}
blockquote .bq {
	direction:ltr;
}
blockquote::-webkit-scrollbar {
	width: 8px;
}
blockquote::-webkit-scrollbar-track {
	background: #fff;
	width: 2px;
	border: none;
	box-shadow: none; 
}
blockquote::-webkit-scrollbar-thumb {
	box-shadow: none;
}
blockquote::-webkit-scrollbar-corner {
	border: none;
}
blockquote::-webkit-scrollbar-thumb {
	background:#db807d;
}

/* mv_bnr
--------------------------------*/
.mv_bnr {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: space-between;
}
.mv_bnr li {
	width: 32%;
}
.mv_bnr li a {
	display: block;
}
.mv_bnr li img {
	width: 100%;
}



/*********************************************

	section3 style

*********************************************/
#message {
	position:relative;
	max-width:1200px;
	width:100%;
	margin: 0 auto 30px;
	padding: 210px 0 140px 170px;
	box-sizing: border-box;
	background-image:
		url("../images/logo3.svg"),
		url("../images/message_name.png");
	background-repeat: no-repeat, no-repeat;
	background-position: 93% 65%, 50% 100%;
	background-size: 33% 420px , 20% auto ;
}
#message h2 {
	top:220px;
}
.msg_box h3 {
	margin: 0 0 60px 0;
}
.msg_box h3 .jp {
	display: block;
	margin: 0 0 15px 0;
	font-size: 43px;
	font-weight: bold;
	line-height: 1.5;
	letter-spacing: 0.1em;
}
.msg_box h3 .en {
	display: block;
	font-size: 28px;
	font-weight: bold;
	letter-spacing: 0.2em;
}
.msg_box .msg_text {
	display: block;
	font-size: 15px;
	font-weight: bold;
	line-height: 3.5;
	letter-spacing: 0.6em;
	font-family: 'Noto Sans Japanese';
}



/*********************************************

	section4 style

*********************************************/
.bg_wh {
	width: 100%;
	background: url("../images/recruit_img02.png") no-repeat;
	background-position: 10% 28%;
	background-position: 0 28%;
	background-size: 700px;
}
#recruit {
	position:relative;
	width:100%;
	max-width:1200px;
	margin: -100px auto 50px;
	padding: 150px 0 0 0;
	box-sizing: border-box;
	background-image:
		url("../images/recruit_img01.png"),
		url("../images/recruit_img03.png");
	background-repeat: no-repeat, no-repeat;
	background-position: 93% 16%, 100% 82%;
	background-size: 18% auto , 50% auto ;
}
#recruit h2 {
	top:250px;
}

/* rec_box1
--------------------------------*/
.rec_box1 {
	padding: 90px 0 0 670px;
	margin: 0 0 100px 0;
}
.rec_box1 h3 {
	display: block;
	margin: 0 0 15px 0;
	font-size: 43px;
	font-weight: bold;
	line-height: 1.5;
	letter-spacing: 0.1em;
}
.rec_box1 .recbx1_text {
	display: block;
	padding: 0 0 0 4px;
	font-size: 15px;
	font-weight: bold;
	line-height: 3.5;
	letter-spacing: 0.6em;
	font-family: 'Noto Sans Japanese';
}

/* rec_box2
--------------------------------*/
.rec_box2 {
	margin: 0 0 100px 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: space-between;
}
.rec_box2 .recbx2_point {
	width: 50%;
	padding: 0 0 0 40px;
	box-sizing: border-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: space-between;
}
.rec_box2 .recbx2_point li {
	width: 33%;
	color: #db807d;
	font-size: 15px;
	text-align: center;
	line-height: 1.2;
	letter-spacing: 0.1em;
	font-family: 'Noto Sans Japanese';
}
.rec_box2 .recbx2_point li img {
	width: 60%;
	margin: 0 0 8px 0;
}
.rec_box2 .recbx2_text {
	width: 50%;
}
.rec_box2 .recbx2_text p {
	display: inherit;
	padding: 0 0 0 70px;
	font-size: 15px;
	font-weight: bold;
	text-align: left;
	line-height: 2.4;
	letter-spacing: 0.5em;
	font-family: 'Noto Sans Japanese';
}

/* btn
--------------------------------*/
#recruit .btn {
	margin: 0 auto;
}



/*********************************************

	section5 style

*********************************************/
.bg_bd {
	background: url("../images/aw_bg.png") repeat;
	margin: 0 0 50px 0;	
	overflow: hidden;
}
#award {
	position:relative;
	width:100%;
	max-width:1200px;
	margin: -140px auto 30px;
	padding: 170px 0 0 0;
	box-sizing: border-box;
}
#award h2 {
	top:260px;
}

/* aw-inner
--------------------------------*/
.aw-inner {
	max-width: 1200px;
	height: 726px;
	background-image:
		url("../images/award_img01.png"),
		url("../images/logo4.svg"),
		url("../images/award_bg_pc.png");
	background-repeat: no-repeat, no-repeat, no-repeat;
	background-position: 110% 100%, 50% 63% , 0 50%;
	background-size: 45%, 10% 10% , 100% auto;
	overflow: hidden;
}

/* aw_box
--------------------------------*/
.aw_box {
	padding: 120px 0 0 180px;	
}
.aw_box h3 {
	display: block;
	margin: 0 0 15px 0;
	font-size: 43px;
	font-weight: bold;
	line-height: 1.5;
	letter-spacing: 0.1em;
}
.aw_box .awbox_text {
	display: inherit;
	margin: 0 0 60px 0;
	font-size: 15px;
	font-weight: bold;
	text-align: left;
	line-height: 3;
	letter-spacing: 0.5em;
	font-family: 'Noto Sans Japanese';
}

/* btn
--------------------------------*/
.aw-inner .btn {
	margin: 0 auto;
}



/*********************************************

	foot-area style

*********************************************/
/* foot-area
--------------------------------*/
.foot-area {
	width: 100%;
}
.foot-area .f-cont {
	position:relative;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

/* f-cont
--------------------------------*/
.f-cont .f_link_sw,
.f-cont .f_link_hc {
	width: 190px;
	margin: 0 auto 50px;
	font-size: 14px;
	font-weight: 600;
	text-align: center;
	letter-spacing: 0.4em;
	font-family: 'Noto Sans Japanese';
}
.f-cont .f_link_sw img,
.f-cont .f_link_hc img {
	width: 100%;
	height: auto;
}
.f-cont .f_link_sw > p,
.f-cont .f_link_hc > p {
	margin: 0 0 10px 0;
}

/* copyright
--------------------------------*/
.copyright p {
	padding: 15px 0;
	font-size: 20px;
	text-align: center;
	letter-spacing: 0.3em;
	background-color: #f0aaaa;
	font-family: 'Noto Sans Japanese';
}



/*********************************************

	foot style

*********************************************/
footer {
	padding: 100px 15px 30px;
	text-align: center;
	color: #fff;
	background: #1C1B20;
}
footer a {
	color: #ffffff;
	text-decoration: none;
}
#product_contact {
	font-size: 16px;
}
#product_contact a {
	-webkit-transition: color ease 0.2s;
	transition: color ease 0.2s;
}
#product_contact a:hover {
	opacity:1;
	filter:alpha(opacity=100);
	color: #acacac;
}
footer .company_link {
	margin-top: 50px;
	line-height: 1.3;
}
footer .company_link a {
	padding: 8px;
    -webkit-transition: color ease 0.2s;
	transition: color ease 0.2s;
}
footer .company_link a:hover {
	opacity:1;
	filter:alpha(opacity=100);
    color: #acacac;
}
footer small {
	margin-top: 100px;
	display: block;
	line-height: 1;
	letter-spacing: 0.3em;
	font-size: 10px;
    font-weight: 400;
    font-family: "Rubik", serif;
}
#product_contact {
	font-size: 16px;
}
#product_contact a {
    -webkit-transition: color ease 0.2s;
	transition: color ease 0.2s;
}
#product_contact a:hover {
    color: #acacac;
	opacity:1;
	filter:alpha(opacity=100);
}
#go_to_online {
	padding: 15px 20px;
	display: block;
	position: fixed;
	bottom: 30px;
	right: 0;
	z-index: 23;
	overflow: hidden;
	background: #000;
	border-radius: 30px 0 0 30px;
    -webkit-box-shadow: -3px 3px 20px 0 rgba(0, 0, 0, 0.3);
    		box-shadow: -3px 3px 10px 0 rgba(0, 0, 0, 0.3);
	-webkit-transition: background ease 0.5s;
			transition: background ease 0.5s;
}

#go_to_online {
	display: none;
}














/*****************************************************************************************
  PC
*****************************************************************************************/
@media screen and (max-width:1200px) {
.header-area .copy h1 {
	font-size:24px;
	margin: 0 0 40px 0;
}
.header-area .copy .cp-logo {
	width: 280px;
}
}









/*****************************************************************************************
  PC
*****************************************************************************************/
@media screen and (max-width:1024px){
/*********************************************

	header-area style

*********************************************/
/* header-inner
--------------------------------*/
header .header-inner {
	padding: 15px 15px 20px;
	margin: 0 auto;
}
.header-inner .logo {
	width: 150px;
}

/* gnavi
--------------------------------*/
.header-inner .gnavi {
	margin: 30px 20% 0 0;
}

/* sns
--------------------------------*/
.sns {
	top:25px;
	right:15px;
}
.sns li {
	width:45px;
	margin:0 10px 0 0;
}

/* mv
--------------------------------*/
.header-area .mv {
	padding-top: 86px;
	margin: 0 0 40px 0;
 }
.header-area .mv .mv-inner {
	padding-bottom: calc(100%*1210/2500);
	background-size: 100% auto;
	background-position: 50% 50%;
}	

/* copy
--------------------------------*/
.header-area .copy {
	top:28%;
	right:12%;
}
.header-area .copy h1 {
    font-size: 20px;
    letter-spacing: 0.4em;
    line-height: 1.8;
    margin: 0 0 50px 0;
}
.header-area .copy .cp-logo::after{
	height: 95px;
}


/*********************************************

	section h2 style

*********************************************/
section h2 {
	top:145px;
	left:15px;
}
section h2 img {
	width:60px;
}



/*********************************************

	section1 style

*********************************************/
#sample {
	margin: -126px auto 70px;
	padding: 146px 0 0 100px;
}
/******************************

	splist style

******************************/
#sample .splist {
	padding: 0 15px 0 0;
}
/* li Default
--------------------------------*/
#sample .splist li {
	width: 440px;
}

/* img */
#sample .splist li .splist-img {
	width: 220px;
	height: auto;
}

/* ttl */
#sample .splist li > h3 {
	width: 220px;
	height: auto;
	padding: 10px 0 10px 15px;
}

/* textbox */
#sample .splist li .spbox-text {
	width: 220px;
	height: 184px;
    padding: 15px;
}
#sample .splist li .spbox-text h4 {
	padding: 0 0 90px 0;
	font-size: 1.5vw;
}

/* spec */
#sample .splist li span {
	font-size: 1.6vw;
}

/* li Modal
--------------------------------*/
#sample .sample_mbox {
	box-sizing: border-box;
	padding: 0 20px;
}
#sample .sample_mbox .mbox-l {
	left: 20px;
}
#sample .sample_mbox .mbox-r {
	right: 20px;
}

/* price
--------------------------------*/
.price {
	padding: 0 15px 0 0;
}
.price .p_table {
    margin: 0 50px 0 0;
}
.price .p_table table caption {
	font-size: 19px;
	margin: 0 0 8px 0;
}
.price .p_table table td {
	padding: 8px;
	font-size: 17px;
}



/*********************************************

	section2 style

*********************************************/
#pr {
	margin:-85px auto 0;
	padding:145px 0 70px 0;
}
.pr-box h3 {
	margin: 0 0 25px 100px;
}

/* creative
--------------------------------*/
.pr-box .creative .cv_img {
	top: -30px;
	right: 30px;
	width: 200px;
}
.pr-box .creative .cv_name {
	top: 125px;
	right: 120px;
	width: 200px;
}

/* pr-music
--------------------------------*/
.pr-music {
	margin: 0 0 30px 100px;
}

/* music_box
--------------------------------*/
.music_box {
	max-width: 470px;
}
.mv_ttl img {
	box-sizing: border-box;
	padding: 0 1%;
}

/* lyrics_box
--------------------------------*/
.lyrics_box {
	padding: 0 25px 0 0;
}
blockquote {
	margin: 100px 0 20px 0;
}

/* mv_bnr
--------------------------------*/
.mv_bnr {
	padding: 0 15px;
	box-sizing: border-box;
}



/*********************************************

	section3 style

*********************************************/
#message {
	margin: 0 auto 30px;
	padding: 100px 0 140px 100px;
	background-position: 93% 70%, 50% 100%;
}
#message h2 {
    top: 110px;
}
.msg_box h3 {
	margin: 0 0 30px 0;
}



/*********************************************

	section4 style

*********************************************/
.bg_wh {
	background-position: -50px 28%;
	background-size: 600px;
}
#recruit {
	margin: -85px auto 50px;
	padding: 85px 0 0 0;
	background-position: 97% 16%, 110% 82%;
}

/* rec_box1
--------------------------------*/
.rec_box1 {
	padding: 90px 0 0 570px;
	margin: 0 0 100px 0;
}

/* rec_box2
--------------------------------*/
.rec_box2 .recbx2_point {
    padding: 0 0 0 20px;
}
.rec_box2 .recbx2_point li {
	font-size: 14px;
	line-height: 1.4;
}



/*********************************************

	section5 style

*********************************************/
#award {
	margin: -85px auto 30px;
	padding: 115px 50px  0;
}
#award h2 {
	top:175px;
}

/* aw-inner
--------------------------------*/
.aw-inner {
	height: 100%;
	background-position: 100% 100%, 50% 63% , 0 50%;
	background-size: 40%, 10% 10% , 100%;
}

/* aw_box
--------------------------------*/
.aw_box {
	padding: 50px 0 0 80px;	
}
.aw_box .awbox_text {
	margin: 0;
}
	
/* aw_box
--------------------------------*/
.aw_box h3 {
	display: block;
	margin: 10px 0 10px 0;
	font-size: 43px;
	line-height: 1.3;
}
.aw_box .awbox_text {
	margin: 0 0 30px 0;
	font-size: 15px;
	line-height: 2.8;
}

/* btn
--------------------------------*/
.aw-inner .btn {
	margin: 0 auto 60px;
}

}









/*****************************************************************************************
  tablet iPad
*****************************************************************************************/
@media screen and (max-width:768px){

/* btn
--------------------------------*/
.btn {
	max-width: 320px;
}
.btn a {
	padding: 32px 0;
	font-size: 20px;
}
/*********************************************

	topview style

*********************************************/
.topview .tv_cp {
	font-size: 25px;
}
.topview .tv_img {
	max-width: 250px;
}



/*********************************************

	header-area style

*********************************************/
/* copy
--------------------------------*/
.header-area .copy {
	top:33%;
	right:10%;
}
.header-area .copy h1 {
    font-size: 18px;
    letter-spacing: 0.4em;
    line-height: 1.8;
    margin: 0 0 40px 0;
}
.header-area .copy .cp-logo {
	width: 170px;
}
	
	
	
/*********************************************

	section1 style

*********************************************/
/******************************

	splist style

******************************/
/* li Modal
--------------------------------*/
/* ttl */
.mbox-l h3,
.mbox-r h3 {
	width: 220px;
	padding: 15px 0 15px 15px;
}

/* textbox */
#sample .mbox-text {
	width: 220px;
}
#sample .mbox-text h4 {
	padding: 0 0 70px 0;
}
/* li Default
--------------------------------*/
#sample .splist li {
	width: 320px;
}

/* img */
#sample .splist li .splist-img {
	width: 160px;
}

/* ttl */
#sample .splist li > h3 {
	width: 160px;
	height: 35px;
	font-size: 1.8vw;
}
#sample .splist li > h3::before {
    padding: 0 0 0 10px;
}

/* textbox */
#sample .splist li .spbox-text {
	width: 160px;
	height: 125px;
	font-size: 1.6vw;
}
#sample .splist li .spbox-text h4 {
	padding: 0 0 50px 0;
	font-size: 1.8vw;
}
	
/* close */
#sample .sample_mbox .modal_close {
	top: 15px;
	right: 35px;
}

/* price
--------------------------------*/
.price .p_table {
	flex-grow: 0;
    margin: 0 10px 0 0;
}



/*********************************************

	section2 style

*********************************************/
.pr-box h3 {
	max-width: 500px;
	margin: 0 0 50px 100px;
}

/* creative
--------------------------------*/
.pr-box .creative .cv_img {
	top: -40px;
	right: 10px;
	width: 140px;
}
.pr-box .creative .cv_name {
	top: 55px;
	right: 80px;
	width: 120px;
}

/* music_box
--------------------------------*/
.music_box {
	max-width: 350px;
}
.mv_ttl {
	max-width: 350px;
	margin: 0;
	padding: 5px 0;
}
.video {
	max-width: 350px;
	height: 250px;
}

/* lyrics_box
--------------------------------*/
blockquote {
	max-width: 270px;
	height: 200px;
	margin: 0 0 20px 0;
}
.arrow a {
	font-size: 2.3vw;
}



/*********************************************

	section3 style

*********************************************/
#message {
	margin: 0 auto 30px;
	padding: 100px 0 100px 100px;
    background-position: 96% 80%, 50% 100%;
}
.msg_box h3 {
	margin: 0 0 20px 0;
}
.msg_box h3 .jp {
	font-size: 35px;
	margin: 0 0 10px 0;
	line-height: 1.4;
}
.msg_box h3 .en {
	font-size: 22px;
}
.msg_box .msg_text {
	font-size: 14px;
	line-height: 3;
	letter-spacing: 0.4em;
}



/*********************************************

	section4 style

*********************************************/
.bg_wh {
	background-position: -80px 28%;
	background-size: 480px;
}
#recruit {
	background-position: 97% 16%, 110% 80%;
	background-size: 15% auto , 50% auto;
}

/* rec_box1
--------------------------------*/
.rec_box1 {
	padding: 90px 0 0 410px;
	margin: 0 0 50px 0;
}
.rec_box1 h3 {
	font-size: 35px;
	margin: 0 0 10px 0;
	line-height: 1.4;
}
.rec_box1 .recbx1_text {
	font-size: 14px;
	line-height: 3;
	letter-spacing: 0.4em;
}

/* rec_box2
--------------------------------*/
.rec_box2 {
	margin: 0 0 60px 0;
}
.rec_box2 .recbx2_point {
    padding: 0 0 0 10px;
}
.rec_box2 .recbx2_point li {
	font-size: 11px;
	line-height: 1.4;
}
.rec_box2 .recbx2_text p {
	font-size: 14px;
	padding: 0 0 0 30px;
	letter-spacing: 0.4em;
}



/*********************************************

	section5 style

*********************************************/
#award {
	margin: -85px auto 30px;
	padding: 110px 20px 0;
}
#award h2 {
	top:180px;
}

/* aw-inner
--------------------------------*/
.aw-inner {
	height: 100%;
	background-position: 105% 100%, 51% 65% , 0 25%;
	background-size: 40%, 10% 10% , 100% 100%;
}

/* aw_box
--------------------------------*/
.aw_box h3 {
    font-size: 35px;
    margin: 65px 0 5px 70px;
    line-height: 1.4;
}
.aw_box .awbox_text {
	margin: 0 0 60px 0;
	font-size: 15px;
	text-align: left;
	line-height: 3;
	letter-spacing: 0.5em;
}
.aw_box {
	padding: 0;
}
.aw_box .awbox_text {
	margin: 0 0 20px 0;
	padding: 0 0 0 70px;
	font-size: 14px;
	line-height: 2.8;
	letter-spacing: 0.4em;
}
}



















/*****************************************************************************************
  smartphone
*****************************************************************************************/
@media screen and (max-width:480px) {
/* btn
--------------------------------*/
.btn {
	max-width: 260px;
	margin: 0 auto;
}
.btn a {
	display: block;
	padding: 25px 0;
	font-size: 4vw;
}

/* PC none
--------------------------------*/
.sns {display: none;}
.sp-sns {display: block;}
.mv_ttl_sp {display: block;}
.lyrics_btn {display: block;}
.lyrics_box .arrow br {display: none;}
.lyrics_pc {display: none;}
.lyrics_sp {display: block;}
.br{display: block;}



/*********************************************

	topview style

*********************************************/
.topview {
	flex-direction: column;
	text-align: left;
	padding: 0 10%;
	height: auto;
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
}
.topview .tv_cp {
	flex: inherit;
	font-size: 6vw;
	line-height: 1.5;
	letter-spacing: 0.2em;
	margin: 0 0 40px 20px;
}
.topview .tv_img {
	flex: inherit;
	width: 100%;
	max-width: 500px;
}



/*********************************************

	header-area style

*********************************************/
.header-area header {
    background: rgba(255, 255, 255, 1);
}

/* header-inner
--------------------------------*/
header .header-inner {
	margin: 0;
	padding: 0;
}
.header-inner .logo {
	display: block;
	width: 100%;
	margin: 0 auto;
	max-width: 130px;
	padding: 10px 0 15px;
    background: rgba(255, 255, 255, 1); 
	z-index: 100;
}

/* gnavi
--------------------------------*/
.header-inner .gnavi {
	margin:0;
}
.header-inner .gnavi ul li a {
	display: block;
}

/* mv
--------------------------------*/
.header-area .mv {
	padding-top: 65px;
	margin: 0;
 }
.header-area .mv .mv-inner {
	height:300px;
	background-size:cover;
	background-position:30% 50%;
}

/* copy
--------------------------------*/
.header-area .copy {
	position: static;
	width:100%;
	padding: 30px 40px;
	box-sizing: border-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: space-between;
	align-items:flex-end;
}
.header-area .copy h1 {
	width: 58%;
	font-size:3.7vw;
	letter-spacing:0.25em;
	line-height:1.6;
	margin: 0;
}
.header-area .copy div {
	width: 40%;
}
.header-area .copy .cp-logo {
	width:100%;
}
.header-area .copy .cp-logo img {
	width:100%;
}
.header-area .copy .cp-logo::after {
	content: none;
}
	


/*********************************************

	menu style

*********************************************/
#menu {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	color: #000;
	text-align: center;
	transform: translateY(-100%);
	transition: all .6s;
     -webkit-transition: all .6s;
}
#menu ul {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	background: rgba(255, 255, 255, .8);
}
#menu ul li {
	width: 100%;
	padding: 0;
	font-size: 4.8vw;
	border-bottom: 3px #ffffff solid;
}
#menu ul li:last-child {
	padding-bottom: 0;
	border-bottom: none;
}
#menu ul li a {
	color: #000;
	padding: 22px 0 20px;
}
#menu.active {
	transform: translateY(0%);
	top:70px;
}

/* sns
--------------------------------*/
.mv-inner .sp-sns {
	position:absolute;
	left: 0;
	right: 0;
	bottom:22%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: center;
}
.mv-inner .sp-sns li {
	width:40px;
	margin:0 15px 0 0;
}
.mv-inner .sp-sns li:last-child {
	margin:0;
}

/* ハンバーガーメニュー
--------------------------------*/
.navToggle {
	display: block;
	position: fixed;
	right: 4%;
	top: 35px;
	width: 35px;
	height: 20px;
	cursor: pointer;
}
.drawer-hamburger {
	position: relative;
	display: block;
}
.drawer-hamburger {
	position: relative;
	display: block;
}
.drawer-hamburger, .drawer-hamburger:after, .drawer-hamburger:before {
	width: 100%;
	height: 3px;
	-webkit-transition: all .6s cubic-bezier(.19, 1, .22, 1);
	transition: all .6s cubic-bezier(.19, 1, .22, 1);
	background-color: #d6706e;
}
.drawer-hamburger:after, .drawer-hamburger:before {
	position: absolute;
	top: -10px;
	left: 0;
	content: ' '
}
.drawer-hamburger:after {
	top: 10px;
}
.active .drawer-hamburger {
	background-color: transparent;
}
.active .drawer-hamburger:after, .active .drawer-hamburger:before {
	top: 0;
}
.active .drawer-hamburger:before {
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg)
}
.active .drawer-hamburger:after {
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg)
}



/*********************************************

	section h2 style

*********************************************/
section h2 {
	top:100px;
	left: 20px;
}
section h2 img {
	width:35px;
}



/*********************************************

	section1 style

*********************************************/
#sample {
	margin: -98px auto 50px;
	padding: 100px 20% 0;
}
/******************************

	splist style

******************************/
/* li Default
--------------------------------*/
#sample .splist {
	padding: 0;
	margin: 0;
}
#sample .splist li {
	width: 100%;
}

/* img */
#sample .splist li .splist-img {
	float: none;
	width: 100%;
	height: auto;
}

/* ttl */
#sample .splist li > h3 {
	float: none;
	width: 100%;
	height: auto;
	padding: 10px 0 10px 10px;
	font-size: 4vw;
}

/* textbox */
#sample .splist li .spbox-text {
	width: 100%;
	height: auto;
	float: none;
    padding: 10px;
	text-align: right;
}
#sample .splist li .spbox-text h4 {
	padding: 0;
	margin: 0;
	font-size: 3.5vw;
}

/* spec */
#sample .splist li .spbox-text span {
	display: none;
}


/* li Modal
--------------------------------*/
#sample .sample_mbox .mbox-l,
#sample .sample_mbox .mbox-r {
	position: static;
	bottom: 0;
	left: 0;
}

/* ttl */
.mbox-l h3,
.mbox-r h3 {
	width: 100%;
}

/* textbox */
#sample  .mbox-text {
	width: 100%;
}
#sample  .mbox-text h4 {
	padding: 0 0 10px 0;
}
#sample .splist li span {
    font-size: 3vw;
}
	
/* close */
#sample .sample_mbox .modal_close {
	top: 10px;
	right: 30px;
}

	
	
/* price
--------------------------------*/
.price {
	padding: 0;
}
.price .p_table {
    margin: 0 0 30px 0;
}
.price .p_table table caption {
	font-size: 5vw;
}
.price .p_table table td {
	padding: 8px 9px;
	font-size: 3.3vw;
}
.price .p_table p{
	font-size: 3vw;
}



/*********************************************

	section2 style

*********************************************/
.bg_pk {
	padding: 40px 0 0 0;
}
#pr {
	margin:-100px auto 0;
	padding: 100px 5% 0;
}
.pr-box h3 {
	width: 80%;
	margin: 0 0 25px 18%;
}

/* creative
--------------------------------*/
.pr-box .creative .cv_img {
	top: 30px;
	right: 1%;
	width: 150px;
}
.pr-box .creative .cv_name {
	top: 120px;
	left: 18%;
	width: 180px;
}

/* pr-music
--------------------------------*/
.pr-music {
	margin: 0 0 30px 0;
}

/* music_box
--------------------------------*/
.music_box {
	max-width: 520px;
	margin: 0 0 30px 0;
}
.mv_ttl {
	padding: 5px 0;
	margin: 140px 0 0;
}
.mv_ttl img {
	width: 100%;
	padding: 0 3%;
}

/* lyrics_box
--------------------------------*/
.lyrics_box {
	width: 100%;
	padding: 0 ;
	box-sizing: border-box;
}

/* lyrics_cont
--------------------------------*/
.lyrics_cont  {
	width: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: space-between;
}
.lyrics_cont  > div {
	width: 48%;
	background-color: #db807d;
	border-radius: 15px;
}

/* modal
--------------------------------*/
.lyrics_sp .modal_box .mv_ttl_sp {
	width: 100%;
}
.lyrics_sp .modal_box .mv_ttl_sp img {
	width: 100%;
	margin: 0 0 30px 0;
}
.lyrics_sp .modal_box blockquote {
	max-width: 100%;
	width: 100%;
	height: 60vh;
	color: #dd8c8a;
	background-color: #efefef;
	margin: 0;
	padding: 3%;
	line-height: 1.8;
	font-size: 4.2vw;
	font-weight: normal;
	font-family: 'Noto Sans Japanese';
	box-sizing: border-box;
	overflow:scroll;
	overflow-x:hidden;
	direction:ltr;
	text-align: left;
}
.lyrics_sp blockquote::-webkit-scrollbar {
	width: 6px;
	height: 10px;
}
.lyrics_sp .modal_box {
	position: fixed;
	display: none;
	width: 100vw;
	height: 80vh;
	margin: 0;
	padding: 10%;
	background: #ffffff;
	overflow: hidden;
	box-sizing: border-box;
	z-index: 550;
}
.lyrics_cont .modal_close {
	cursor : pointer;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 37px;
	font-size: 30px;
	font-weight: bold;
	color: #dc807e;
	line-height: 45px;
	font-family: 'Noto Sans Japanese';
}

/* lyrics_btn
--------------------------------*/
.lyrics_box .btn br {
	display: block;
}
.lyrics_box .btn {
	padding: 10px 0;
	line-height: 1.3;
}
.lyrics_box .btn a {
	/*padding: 0;*/
	padding: 7% 0 0 0;
}
.lyrics_btn a {
	display: block;
	font-size:4vw;
	padding: 20px 0 ;
	color: #ffffff;
	text-align: center;
     transition: all .5s;
     -webkit-transition: all .5s;
}

/* mv_bnr
--------------------------------*/
.mv_bnr {
	flex-direction: column;
	margin: 0 0 20px 0;
}
.mv_bnr li {
	width: 90%;
	margin: 0 auto 20px;
}



/*********************************************

	section3 style

*********************************************/
#message {
	margin: -30px auto 0;
	padding: 70px 5% 0;
	background-position: 93% 12%, 90% 100%;
	background-size: 22% 200px , 28% auto ;
}
#message h2 {
	top:95px;
}
.msg_box {
	background-position: 100% 8%;
	background-size: 80px auto;
}
.msg_box h3 {
	padding: 9% 0 0;
	margin: 0 0 20px 16%;
}
.msg_box h3 .jp {
	margin: 0 0 5px 0;
	font-size: 5.3vw;
	line-height: 1.5;
}
.msg_box h3 .en {
	font-size: 3vw;
}
.msg_box .msg_text {
	margin: 0 0 0  16%;
	padding: 0 0 50px 0;
	font-size: 3.5vw;
	line-height: 2.5;
	letter-spacing: 0.4em;
}



/*********************************************

	section4 style

*********************************************/
.bg_wh {
	background-position: 0% 38%;
	background-size: 350px;
}
#recruit {
	margin:-68px auto 0;
	padding: 100px 0 0;
	background-position: 93% 11%, 100% 89%;
	background-size: 26% auto , 85% auto ;
}
#recruit h2 {
	top:100px;
}

/* rec_box1
--------------------------------*/
.rec_box1 {
	padding:  0;
	background-position: 95% 10%;
	background-size: 120px;
	margin: 0 0 220px 0;
}
.rec_box1 h3 {
	padding: 3% 0 0;
	margin: 0 0 10px 20%;
	font-size: 5.3vw;
	line-height: 1.5;
}
.rec_box1 .recbx1_text {
	margin: 0 0 0 20%;
	padding: 0 0 60px 0;
	font-size: 3.5vw;
	line-height: 2.5;
	letter-spacing: 0.4em;
}

/* rec_box2
--------------------------------*/
.rec_box2 {
	margin: 0;
	flex-direction: column;
}
.rec_box2 .recbx2_point {
	width: 100%;
	padding: 0 0 0 40px;
	flex-direction: column;
}
.rec_box2 .recbx2_point li {
	width: 100%;
	margin: 0 0 10px 0;
	padding: 0 5% 0 0;
	font-size: 4vw;
	line-height: 1.5;
	text-align: left;
	box-sizing: border-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	align-items: center;
}
.rec_box2 .recbx2_point li p:first-child {
	width: 23%;
	margin: 0 20px 0 0;
}
.rec_box2 .recbx2_point li p {
	width: 70%;
}
.rec_box2 .recbx2_point li img {
	width: 100%;
	margin: 0 0 8px 0;
}
.rec_box2 .recbx2_text {
	width: 100%;
	margin: 0 0 -50px 0;
	padding: 0 0 150px 0;
	background-position: 160% 0%;
	background-size: 90% 70%;
}
.rec_box2 .recbx2_text p {
	margin: 5% 0 0 8%;
	padding:0;
	font-size: 3.5vw;
	line-height: 2.5;
	letter-spacing: 0.3em;
}

/* btn
--------------------------------*/
#recruit .btn {
	margin: 0 auto 40px;
}



/*********************************************

	section5 style

*********************************************/
.bg_bd {
	background-size: 8px 8px;
	margin: 0 0 50px 0;	
}
#award {
	margin: -70px auto 30px;
	padding: 100px 0 0 20px;

}
#award h2 {
	top:90px;
}

/* aw-inner
--------------------------------*/
.aw-inner {
	height: 100%;
	background-image: none;

}

/* aw_box
--------------------------------*/
.aw_box {
	padding: 0 ;
}
.aw_box h3 {
	margin: 0 0 10px 15%;
	font-size: 5vw;
	line-height: 1;
	letter-spacing: 0.1em;
}
.aw_box .awbox_text {
	margin: 0;
	font-size: 3.4vw;
	padding: 7vw 14vw 13vw;
	line-height: 2.2;
	letter-spacing: 0.3em;
	background-image: url(../images/award_img01.png),
		url(../images/logo4.svg),
		url(../images/award_bg_sp.png);
	background-repeat: no-repeat, no-repeat ,no-repeat;
	background-position: 105% 100%, 70% 85%,0;
	background-size: 30%, 10% 10%, contain;
}

/* btn
--------------------------------*/
.aw-inner .btn {
	margin: 20px auto 0;
}



/*********************************************

	foot-area style

*********************************************/
/* sns
--------------------------------*/
.foot-area .sp-sns {
	position:absolute;
	left: 0;
	right: 0;
	top: 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-ms-flex-wrap : wrap;
	-webkit-flex-wrap : wrap;
	justify-content: center;
}
.foot-area .sp-sns li {
	width:40px;
	margin:0 15px 0 0;
}
.foot-area .sp-sns li:last-child {
	margin:0;
}

/* f-cont
--------------------------------*/
.f-cont .f_link_sw,
.f-cont .f_link_hc {
	margin: 0 auto 40px;
	font-size: 3.2vw;
	text-align: left;
}
.f-cont .f_link_sw {
	padding: 80px 0 0 0;
}
.f-cont .f_link_sw img,
.f-cont .f_link_hc img {
	width: 100%;
	height: auto;
}
.f-cont .f_link_sw > p,
.f-cont .f_link_hc > p {
	width: 80%;
	margin: 0 auto 5px;
}

/* copyright
--------------------------------*/
.copyright p {
	font-size: 4vw;
}

/* Suzukiが追記したよ！
--------------------------------*/
	.sp_imggene100 {
		width:100%;
		height:auto !important;
	}
	
	.sp_imggene85 {
		width:85%;
		height:auto !important;
	}
	
	.sp_imggene60 {
		width:60%;
		height:auto !important;
	}

	.sp_imggene50 {
		width:50%;
		height:auto !important;
	}

}








/*****************************************************************************************
  Media Queries
*****************************************************************************************/
@media screen and (max-width:320px) {
.rec_box2 .recbx2_point li p:first-child {
    width: 23%;
    margin: 0 15px 0 0;
}
}