@charset "utf-8";
@charset "utf-8";

/*リセット*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, input, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, object, embed
{
	margin: 0px; 
	padding: 0px; 
	border: 0px; 
	outline: 0px; 
}

dl, dt, dd, ol, ul, li {
	list-style:none;
}

img {
	border: 0;
}

li {
	list-style: none;
}

input,
button,
textarea,
select,
optgroup,
option {
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: inherit;
}
b{ font-weight:bold}

.sponly{ display:none}



/***************************************
 * Global
 ***************************************/

* {
  padding:0;
  margin: 0;
}

html {
  height: 100%;
}

body {
  font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: #000; 
  width:100%;
  /*height:100%;*/
  overflow-x:hidden;
}

@media (max-width:480px) {
	body{font-size: 14px}
}


/***************************************
 * Common
 ***************************************/


.clearfix:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.clearfix { min-height: 1px;}
* html .clearfix { height: 1px; /*¥*//*/ height: auto; overflow: hidden;/**/}

a {
  color:#0857a9;
  text-decoration:none;
}

img {
  vertical-align: bottom;
}

a:hover  { 
  text-decoration: underline;
}

input, select, textarea {
  font-size: 100%;
}

button {
  padding: 5px 40px;
  border-radius: 5px;
  color: #fff;
  font-size: 90%;
  font-weight: bold;
  cursor: pointer;
}

.element2 {
  display: block;
}

.gray {
  background-color:#eeeeee;
}

.fl_left{ float:left}
.fl_right{ float:right}

.clear{ clear:both}

.small{ font-size: 80%}

/***************************************
 * Layout
 ***************************************/
 
#container {
  width: 100%;
  margin: 0;
	overflow-x: hidden
}

/*==================
 * Header
 */
.sp_only_320,
.sp_only{ display:none}
header {
	width:100%;
	background:url(images/mainImg.jpg?190320_1) no-repeat center center;
  	background-size: cover;
	-webkit-background-size: cover;
	min-height:335px;
	z-index:0;
	position:fixed;
	height:70%;
	top:0;
}
footer.entry-footer,
header.entry-header{ display: none}

.foogallery.fg-border-thin .fg-item-inner{ border: none!important;}
.foogallery.fg-light.fg-shadow-outline .fg-item-inner{ box-shadow: none!important;}

header div.wrap{ width:100%; padding:0; height:100%; margin:0 auto; position:relative; z-index:1}
header div.wrap h1 {
  width: 100%;
  height:80%;
  background:url(images/title.png) no-repeat center bottom;
	background-size: 100%;
  text-indent: -10000px;
  z-index:10;
  position:absolute;
  bottom:-125px;
}

@media (min-width:1700px) {
	header{
	height:90%;
	}
	header div.wrap h1{ width: 90%}
}
@media only screen and (orientation:portrait){
	header{ height: 40%; background-size: contain}
}
 @media (max-width:768px) {
	 header{ background-position: center top; background-size: 100%; height: 50%}
	 header div.wrap{ width:100%; padding:0; height:80%}
	 header div.wrap h1{ bottom: -50px}

	.fl_left{ float:none}
	.fl_right{ float:none}
}

@media (max-width:480px) {
	.pc_only{ display:none}
	.sp_only{ display:block}
	header{ min-height:auto; height:410px; position:relative; min-width:inherit;background:url(images/mainImg_sp.jpg?190320_2) no-repeat left top; background-size:100%}
	header div.wrap{ height: 100%}
	header div.wrap h1{background:url(images/title_sp.png?190320_2) no-repeat center bottom;height: 100%;
	background-size: 100%;bottom: 0px}
}
@media (max-width:320px) {
	header{ min-height:auto; height:310px;}
	header div.wrap{ height: 95%}
}
 
/*==================
 * コンテンツ基本
 */
.contents{ width:100%; background:white; z-index:5; position:relative; padding:10px 0}
.contents:before {
  content: '';
  position: absolute;
  top: 0;
  left: -10%;
  width: 140%;
  height: 80%;
  background: #fff;
  -webkit-transform-origin: left center;
  -ms-transform-origin: left center;
  transform-origin: left center;
  -webkit-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(-2deg);
  z-index: -1;
}

@media (max-width:768px) {
	.contents{ padding:10px 0}
}


/*900px BOX*/
.contents div.box{ width:1000px; box-sizing:border-box; margin:0 auto; padding:40px 20px 80px 20px}
.contents div.box p{ padding:0 0px 20px 0px; line-height: 1.8em}


@media (max-width:768px) {
	.contents div.box{ width:95%; margin: 0 auto}
}

@media (max-width:480px) {
	.contents div.box{ width:90%; padding:10px 0 30px 0}
	.contents div.box img{ width:100%;}
}



/*装飾基本*/
.big{ font-size:18px; font-weight:bold;}
.ubig{ font-size:24px; font-weight:bold; padding:0; text-align:center}
.noppading{ padding:0!important}
.ubig span{ font-size:30px}
.mid{ font-size:16px;}

/*見出し基本*/
.contents h2{ font-size: 30px; font-weight: normal; margin-bottom: 30px;margin-top: -70px; position: relative; z-index: 100; margin-left: -20px}
.contents h2:first-letter{ background: #000; color: white; font-size:60px; padding: 1px 5px; margin-right:5px; line-height: 1em;}
#schedule.contents h2:first-letter,
#project.contents h2:first-letter,
/*#coordinator.contents h2:first-letter,*/
#inq.contents h2:first-letter{ background: #895bff}

.contents h3{ font-size: 20px; margin-bottom: 10px; margin-top: 20px; text-align: center}

@media (max-width:768px) {
	.contents h2{ margin-left: -10px; font-size: 26px}
}
@media (max-width:480px) {
	.contents h2{ margin-left: 0px; font-size: 22px; margin-bottom: 10px; margin-top: -25px}
	.contents h2:first-letter{ font-size: 36px}
	.contents h2 br{ display: none}
	.contents h3{ font-size: 18px}
}

/*プロローグ*/
#prologue{ position:relative; margin-top: 80%}
#prologue.contents h2{ margin-top: 0}

#schedule,
#project,
#inq{ background: #fff6d9}
#schedule.contents:before,
#project.contents:before,
/*#coordinator.contents:before,*/
#inq.contents:before{background:#fff6d9}

ul.ph{ display: flex;justify-content:space-between}
ul.ph li{ width: 33%;  text-align: center}
ul.ph li img{ width:100%; padding-top: 10px}

#prologue .movie { padding: 20px 0; text-align: center}
#prologue .movie iframe{ width: 70%; height: 400px; margin: 0 auto}

div.box>ul.check{ margin: 20px 0; background: #fff; padding: 20px 40px; line-height: 1.4em}
div.box>ul.check li{  margin-bottom: 10px; font-weight: bold; font-size: 16px;
	 background: url(images/check.svg)  no-repeat left 7px; padding-left: 15px; background-size: 10px }
a.borderBt{ display: block; width: 250px; padding: 10px 0; text-align: center; color: #000; border: 1px solid #ccc; font-weight: bold; background: white url(images/arrow.svg) no-repeat 96% center; background-size: 10px; margin: 10px auto 20px auto; border-radius: 40px}
a.borderBt:hover{ background-color:#e48543; color: white; text-decoration: none}

a.top{ background:url(images/arrow_up.svg) no-repeat right center; display:block;  padding: 20px; background-size: 10px; text-align: right}

@media (max-width:1100px) {
	#prologue{ margin-top: 100%}
}

@media only screen and (orientation:portrait){
	#prologue{ margin-top: 70%}
}

@media (max-width:768px) {
	#prologue{ margin-top: 65%}
	#prologue div.box img{ width:100%}
	div.box div.ph img{ width: calc(33.3% - 1px);}
	#prologue div.box div.ph p{ float:none; width:auto; margin-bottom:10px}
	.contents h2{ background-size:100%; width:100%;}
	 div.box div.redBox h3{ font-size:18px}
	
	ul.ph{ display:block}
	ul.ph li{width: 100%; padding-bottom: 20px}
	 
	 .contents h4{ padding:10px}
}
@media (max-width:480px) {
	#prologue{ margin-top: 20px}
	#prologue div.box img{ width:100%}
	div.box div.ph img{ width: 100%; margin-bottom: 10px}
	#prologue .movie{ padding: 10px}
	#prologue .movie iframe{ width: 100%; height: 200px}
	div.box>ul.check{ padding:15px 15px 5px 15px;}
	div.box>ul.check li{ font-size: 14px}

	 .contents h4{ padding:10px}
}

div.box div.movie_all{
	text-align: center;
	padding-bottom: 10px;
}

div.box div.movie_all{
	display: flex;
	justify-content:space-between
}

div.box div.movie_all iframe{
	width: 33%;
	margin-right: 1%;
	height: 200px;
}
div.box div.movie_all iframe:last-child{
	margin-right: 0;
}

@media (max-width:480px) {
	div.box div.movie_all{
		display: block;
	}
	div.box div.movie_all iframe{
		width: 100%;
		height: 200px;
		margin-bottom: 10px
	}
}

#project .peoplewrap{ display: flex; flex-wrap: wrap}
#project .peoplewrap>div,
#project .peoplewrap>ul{ width: 33%; margin-bottom: 20px; padding: 0 10px; box-sizing: border-box}
#project .peoplewrap>div{ margin-bottom: 0px}
#project .peoplewrap h3{ background:#000; text-align: center; color: white; width: 100%; padding: 10px; box-sizing: border-box; margin: 10px}
#project .peoplewrap>div h3{ margin:10px 0}
#project .peoplewrap>ul li{ margin-left: 10px; margin-bottom: 5px}
#project .peoplewrap>ul li:before{ content: "◆"; color:#e48543; margin-right: 3px; font-size: 12px}
#project p.center{ text-align: center; width: 100%}

@media (max-width:480px) {
	#project .peoplewrap{ display: block}
	#project .peoplewrap>div,
	#project .peoplewrap>ul{ width: 100%; padding: 0}
	#project .peoplewrap>ul{ border-bottom: 1px dotted #ccc; padding-bottom: 20px}
	#project .peoplewrap h3,
	#project .peoplewrap>div h3{ margin:10px 0}
	#project .peoplewrap>div p{ padding: 0 10px 20px 10px}
}

#gallery div.box>ul { display: flex; flex-wrap: wrap}
#gallery div.box>ul li{ width:  calc(33% - 1px); margin-right: 1px; margin-bottom: 2px}
#gallery div.box>ul li img{ width: 100%}

.fg-default.fg-gutter-10 .fg-item{ margin-right: 1px; margin-bottom: 2px}


#coordinator{}
#coordinator div.box img.point{ position:absolute; right:10px; top:-80px; z-index:1000}
#coordinator div.box p.staff{ position:absolute; right:300px; top:80px; z-index:1100; display:inline-block; padding:10px; background:#cd1b80; color:white}
#coordinator div.box div.memberBox{}
#coordinator div.box div.memberBox img{ padding-bottom: 10px; width:  calc(49% - 1px);}
#coordinator div.box div.member { padding: 20px 0 0 0; text-align: center; width: 50%;}
#coordinator div.box div.memberBox div.left{ margin-right: 2px}
#coordinator div.box div.member h3{ font-size: 26px;}
#coordinator div.box h4{ padding:10px 0 0px 0px; font-size: 18px; border-bottom: 1px solid #000; margin-bottom: 10px}
#coordinator div.box h4.member{ padding: 10px 0 0 0; font-size: 16px}
#coordinator div.box ul li{ margin-bottom: 20px}
#coordinator div.box ul li h4{ border: none;}
#coordinator div.box h5{ padding:10px 0 0px 10px; font-size: 16px}
#coordinator div.box h5.comment{ border-top: 1px solid #ccc; padding-top: 10px; margin-top: 10px}
#coordinator div.box div.member img{ width: 100%}
#coordinator div.box p.member{padding-top: 20px}

#coordinator div.box ul.support{
	display: flex;
}
#coordinator div.box ul.support li{
	width: 33%;
	text-align: center;
	font-size:14px;
	padding: 0 10px;
}
#coordinator div.box ul.support li img{
	width: 100%;
}

#coordinator div.box ul.support li p strong{
	font-size:18px;
}

#coordinator div.box>ul { display: flex; flex-wrap: wrap;justify-content: space-between; padding-top: 20px}
#coordinator div.box>ul li{ width:50%; padding: 20px 50px; box-sizing: border-box;}
#coordinator div.box>ul li img{ width: 90%; display: block; margin: 10px auto}
#coordinator div.box>ul.oneline{ display:block;}
#coordinator div.box>ul.oneline li{ width: 100%; padding-bottom: 0;margin-right:0;}
#coordinator div.box>ul li p{ padding: 0 0px}
#coordinator div.box>ul li.fukidashi{
	width:70%; padding: 10px 20px; box-sizing: border-box; border:1px solid #ccc; border-radius: 10px;
	position: relative;
}
#coordinator div.box>ul li.fukidashi h4{ padding-left: 0}
#coordinator div.box>ul li.fukidashi>p{ padding: 0}
#coordinator div.box>ul li.fukidashi:after, #coordinator div.box>ul li.fukidashi:before {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

#coordinator div.box>ul li.fukidashi:after {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #fff;
	border-width: 10px;
	margin-top: -10px;
}
#coordinator div.box>ul li.fukidashi:before {
	border-color: rgba(204, 204, 204, 0);
	border-right-color: #ccc;
	border-width: 11px;
	margin-top: -11px;
}

@media (max-width:768px) {
	#coordinator div.box div.member img{ width: 100%}
	#coordinator div.box div.member h3{}
	 
}
@media (max-width:480px) {
	#coordinator div.box div.member{ padding: 10px 0}
	#coordinator div.box div.member h3{ font-size: 18px; margin-bottom: 0}
	#coordinator div.box>ul{flex-flow: column}
	#coordinator div.box>ul li,
	#coordinator div.box>ul.fukka li:nth-child(1),
	#coordinator div.box>ul.fukka li:nth-child(2){ width: 100%;}
	#coordinator div.box>ul li,
	#coordinator div.box>ul.support li{ padding: 20px}
	#coordinator div.box>ul li img,
	#coordinator div.box>ul.support li img,
	#coordinator div.box>ul.fukka li:nth-child(1) img{ width: 60%; display: block; margin: 0 auto}
	#coordinator div.box>ul li.fukidashi:after,
	#coordinator div.box>ul li.fukidashi:before{ display: none}
	#coordinator div.box>ul li.fukidashi{ margin-top: 10px}
	#coordinator div.box>ul li h4{ font-size: 16px; text-align: center; padding: 10px 0 0 0}
	#coordinator div.box ul.support{display: block}
	#coordinator div.box ul.support li{ width: 100%;}
	#coordinator div.box ul.support li p strong{
	font-size:16px;}
	#coordinator div.box ul.support li img{
	padding-bottom: 10px;}
}



#form  h4,
#schedule h4,
#inq h4{ font-size:24px;  font-weight:bold; text-align:left}

span.lineBt{ display:none}

#form.contents h2{ background:url(images/h2_7.png)}

#form div.box{}
#form div.box p.lead{ font-size:18px}

/*#form div.expBox{ font-size:18px; padding:10px 10px 0 10px; border:1px solid #fff;width:890px; box-sizing:border-box; margin:0 auto; background:rgba(255,255,255,0.3)}
#form div.expBox h3{ padding-left:20px; border-bottom:1px solid #fff; margin-bottom:10px}*/
#form div.expBox{ padding:10px;}
#form div.expBox h3{ float:left; width:100px; height:100px; background:#ad0706; text-align:center; color:white; border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%;
padding-top:35px; box-sizing:border-box; margin-right:20px}
#form div.expBox p{ padding-top:20px; font-size:18px; }

#form div.whiteBox{ padding:20px; background:white; width:890px; box-sizing:border-box; margin:30px auto}
#form div.whiteBox h3{ text-align:center; margin-bottom:20px; font-size:24px}

@media (max-width: 760px){
	#form div.whiteBox,
	#form div.expBox{ width:auto}
	#form div.box{ padding:10px 0;}
	#form div.box h3{ font-size:18px}
	#form div.box h3 img{ width:70%; margin-bottom:10px;}
	#form div.expBox h3{ font-size:16px; width:auto; height:auto; padding:10px; float:none;border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; margin:0; font-weight:normal}
	#form div.expBox p{ padding-top:10px; font-size:14px}
	#form div.box p.lead{ font-size:14px;}
	#form ul.place{ padding:5px; width:90%; margin:10px auto 30px auto}
	#form ul.place li{ width:100%; float:none; clear:both}
	#form ul.place li h5{ width:80px; height:80px; font-size:18px; padding-top:10px; margin:10px 10px 20px 0}
	#form ul.place li p span{ font-size:18px}
	#form ul.place li p{ font-size:12px; line-height:1.3em}
	#form  h4, #schedule h4, #inq h4{ font-size:16px; line-height:1.4em}
}

form.exp,form.inq{ margin:10px 20px; font-size:16px}
form.exp p,
form.inq p{ padding:10px 0}
form.exp table{ border-top:1px dashed #bbb; width:100%}
form.exp table th{ border-bottom:1px dashed #bbb; padding:10px 30px 10px 10px; text-align:right}
form.exp table th span,
form.inq table th span{ background:#ad0706; display:inline-block; padding:2px 5px; color:white; font-size:12px; margin-left:10px}
form.exp table td{ border-bottom:1px dashed #bbb; padding:10px}
form.exp input.txt{ border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; padding:10px; margin-right:10px; width:500px; border:1px solid #ccc;}
form.exp input.short{ width:100px}
form.exp textarea{ border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px;  padding:10px; width:500px; height:120px; border:1px solid #ccc;}
form.exp textarea.keireki{ width:500px; height:70px}
form.exp input.send,form.inq input.send{
	border-radius:5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	background:#895bff; 
	color:white;
	text-align:center;
	display:block;
	font-size:24px;
	padding:10px 10px 8px 10px;
	width:77px;
	margin:10px auto;
	width:250px;
	cursor:pointer}
	
form.exp input.send:hover{ opacity:0.7}

form.exp input.back,form.inq input.back{
	border-radius:5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	background:#fff; 
	color:black;
	text-align:center;
	display:block;
	font-size:18px;
	padding:7px 10px 5px 10px;
	width:77px;
	margin:5px auto;
	border:1px solid #bbb;
	width:200px;
	cursor:pointer}

form.inq table{ width:80%; margin:0 auto}
form.inq table th{ padding:10px 10px 10px 10px; text-align:right; font-weight:normal}
form.inq table td{ padding:10px}
form.inq input.txt{ border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; border:1px solid #bbb; padding:10px; margin-right:10px; width:500px}
form.inq textarea{ border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; border:1px solid #bbb; padding:10px; width:500px; height:100px}

p.checboxtext{ text-align:center}

#inq div.box p{ text-align:center}
#inq div.box h4{ text-align:center}
#inq div.box p.att{ font-size: 80%; padding-top: 20px; text-align: left}

.contents div.container p.checboxtext{
	padding: 10px 0;
}

input[type=checkbox] {
  display: none;
}
.checkbox {
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  margin: 0 0px 8px 0;
  padding: 12px 18px 12px 46px;
  vertical-align: middle;
  cursor: pointer;
	/*border: 2px solid #bbb;*/
	margin-left: 10px;
	border-radius: 30px;
	background-color: #fff;
}
.checkbox:hover {
  background-color:#FFE956;
}
.checkbox:after {
  position: absolute;
  top: 50%;
  left: 18px;
  display: block;
  margin-top: -10px;
  width: 20px;
  height: 20px;
  border: 2px solid #bbb;
	background: white;
	border-radius: 3px;
  content: '';
	z-index: 10;
}
.checkbox:before {
  -webkit-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
  position: absolute;
  top: 50%;
  left: 24px;
  display: block;
  margin-top: -7px;
  width: 7px;
  height: 12px;
  border-right: 3px solid #F46036;
  border-bottom: 3px solid #F46036;
  content: '';
  opacity: 0;
	z-index: 100;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
input[type=checkbox]:checked + .checkbox{
	background-color:#FFE956;
}
input[type=checkbox]:checked + .checkbox:before{
  opacity: 1;
}



@media (max-width: 768px){
	input{font-size:16px}
	form.exp, form.inq{ margin:0; padding:10px}
	form.exp table{ width:100%; display:block; box-sizing:border-box; margin:0 auto}
	form.exp table tbody, form.exp table tr, form.exp table th ,form.exp table td{ display:block; width:100%; box-sizing:border-box; padding:10px 0; text-align:left}
		form.exp table tbody, form.exp table tr{ padding:0}
	form.exp input.txt,form.inq input.txt{ width:100%; box-sizing:border-box}
	form.exp input.short{ width:40%; box-sizing:border-box}
	form.exp select{ border:1px solid #ccc; padding:5px; box-sizing:border-box; background:url(images/arrow_under.png) no-repeat right center; background-size:5%; font-size:12px;width:100%;}
	form.exp textarea.keireki,
	form.exp textarea,form.inq textarea{ width:100%; box-sizing:border-box; height:80px}
	form.exp input.send,form.inq input.send{display:block;width: 60%;-webkit-appearance: none;height: 75px;}
	
	form.inq{ float:none; margin:0}
	form.inq table{ width:100%;border-top:1px dotted #ccc}
	
	form.inq table th,form.inq table td{ display:block; width:100%; box-sizing:border-box; text-align:left; border-bottom:1px dotted #ccc}
	
	#inq.contents div.box p.colorBox{ font-size:14px}
		
	#inq div.box p{ text-align:left}
	
}


#banner div.banbox{ width:50%; float:left; padding:20px 0; text-align:center}
#banner div.banbox.kyoryoku{ width:64%; border-right:1px dotted #ccc;}
#banner div.banbox.shusai{ width:35%}

#banner div.banbox h4{ background:none;}

footer{padding:20px 10px 20px 10px; text-align:center; color: white; position:relative; z-index:10; background:#282828}
footer p{ width:1000px; text-align:center; margin:0 auto}
.notice{ color:#ad0706; font-weight:bold}

aside.widget-area{ display: none}

#snsBox{
	position:fixed;
	right:0;
	top:60%;
	padding:20px;
	border-radius:5px 0 0 5px;
    -webkit-border-radius:5px 0 0 5px;
    -moz-border-radius:5px 0 0 5px;
	background-color: rgba(255,255,255,0.9);
	z-index:1000;
	box-shadow: 0px 0px 5px rgba(0,0,0,0.4);}
.twitter,
.fb-share-button{ padding-bottom:10px}


#privacy h2{ font-size:30px; font-weight:bold; padding:30px 0; text-indent:inherit; width:auto; height:auto}
#privacy h4{ text-align:left; padding-bottom:10px}
#privacy h5{ padding-left:20px; font-size:16px}
#privacy ol{ margin-left:50px}
#privacy ol li{ list-style-type:decimal; margin-bottom:10px}

.fb_iframe_widget iframe{right:0}

.contents div.box p.stop{ font-size:22px; color:white; text-align:center; background:#ad0706; line-height:1em; padding:20px 0; margin-bottom:20px}


div.link{
	margin-top: -20px;
	padding: 0px 0px 30px 0px;
	text-align: center;
	/*background: #fff6d9;
	border: 1px solid #ccc;*/
	box-sizing: border-box;
}

#inq div.link{
	margin-top: 20px
}

div.link p{ 
	border-radius: 5px;
	padding: 10px!important;
	line-height: 1em;
	margin-bottom:0;
	margin-bottom: 20px;
	position: relative;
	background:#fff;
	font-weight: bold;
}
div.link p:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
div.link p:before {
	border-color: rgba(204, 204, 204, 0);
	border-top-color: #fff;
	border-width: 13px;
	margin-left: -13px;
}
div.link>div{
	display: flex;
	justify-content: space-between;
}

div.link a{
	display:block;
	padding: 10px 0px;
	margin-right: 5px;
	border-radius: 10px;
	color: white;
	width: 32%;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 20px;
	box-sizing: border-box;
	background: #895bff;
}
div.link a h3{ margin-top: 0}
#prologue div.link a h3{ margin-top: 10px; font-size: 18px}
div.link a img{  display: block; width: 100%;padding-bottom: 5px}

div.link a:hover{ text-decoration: none; opacity: 0.7}
div.link a.fukaya{ background: #ed7c9e}
div.link a.shinsaibashi { background: #e65050}
div.link a.shintora{ background: #ec9a5e}

@media (max-width: 760px){
	div.box p.ph{ padding:0 0 10px 0}
	#privacy h2{ font-size:20px; font-weight:bold; padding:10px 0 5px 10px; margin-bottom:10px}
	div.link{ margin-top: 0}
	div.link>div{ display: block}
	div.link a{display: block; width: 100%; text-align: center; margin-bottom: 5px; margin-right: 0; font-size: 16px}
	#prologue div.link a h3{ margin: 0px; font-size: 16px; }
	footer p{ width:100%; font-size:12px}
	.fb_iframe_widget{width: 100%!important;overflow:scroll;}
	span.lineBt{ display:inline-block; padding-top:10px; height: 20px}
	div.sns{ position:relative!important; top:auto!important; right:auto!important; padding:10px}
	
	#snsBox{
		z-index:2000;
	position:relative;
	right:auto;
	top:auto;
	padding:0;
	margin-top:10px;
	width:100%;
	margin:0 auto;
	border-radius:0;
    -webkit-border-radius:0;
    -moz-border-radius:0;
	background-color:white;
	box-shadow:none;}
	.twitter{ display:inline-block; width:25%; text-align:center; padding:0 5px; vertical-align:bottom; height:20px}
.fb-share-button,
.fb_iframe_widget{ display:inline-block; width:35%;text-align:center; padding:0 5px; vertical-align:bottom}
.hatena,
.lineBt{ display:inline-block; width:25%;text-align:center; padding:0 5px; vertical-align:bottom}
/* .twitter iframe,
.fb-share-button iframe,
.hatena iframe,
.lineBt span a img */

.pconly{ display:none!important}
.sponly{ display:block!important}

}