@charset "utf-8";

html,body {
	width:100%;
}


body {
	font-size: 16px;
	line-height: 170%;
	font-family: "ヒラギノ角ゴ ProN W3", "Osaka", "Hiragino Kaku Gothic ProN", "メイリオ","Meiryo",sans-serif;
	text-align: center;
	color: #240038;
	background: #ddf7f7;
	margin:0;
}

a {
	-webkit-tap-highlight-color:transparent;	/* ハイライト表示抑制 タブレット用 */
	-moz-tap-highlight-color:transparent;
	tap-highlight-color:transparent;
}
a:link { text-decoration:none; color: #0ac6c1; font-weight:bold;}
a:visited { text-decoration:none; color: #0ac6c1;}
a:hover { text-decoration:none; color: #da0c8a;}
a:active { text-decoration:none; color: #da0c8a;}
a.withUnderLine:hover { text-decoration:underline; }


p {
	text-align: justify;
	text-justify: inter-ideograph;	/* for IE */
}
p:first-child {
	margin-top:0;
}

img {border:none; padding:0; margin:0; vertical-align:bottom;}	/* HTML5での余白抑制 */


.fRight {
	float:right;
	margin:0 0 0 15px;
	border-radius:10px;
}





/* clear:both; 回避用 */

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

.clearfix {
	display: inline-table;
}

/* Hides from IE-mac */
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */




/*///////////////// ページ全体 /////////////////*/


#container {
	width:1000px;
	margin:0 auto 0; auto;
	background:url('../img/bg_white1000.png');
	box-shadow:0px 0px 10px 2px rgba(0,0,0,0.3);
	text-align:center;
	position:relative;
}

#IDmainBody {
	width:840px;
	display:inline-block;
}

.smallTxt {
	font-size:0.85em;
}

.boldTxt {
	font-weight:bold;
}

.underLineTxt {
	background: linear-gradient(transparent 85%, #f999dd 50%);
}

.starDivider {
	margin:50px auto;
}

.right {
	text-align:right;
}

.divFirstLabel {
	text-align:left;
	margin-top:100px;
}

.divLatterLabel {
	text-align:left;
	margin-top:70px;
}

.mainPara {
	text-align:left;
	font-size:100%;
	line-height:160%;
	margin:25px 0 0 0;
}

.left200 {
	margin-left:200px;
}

.bottom-10 {
	margin-bottom:-10px;
}

.caution {
	color:#e00;
}



/*///////////////// 共通 メニュー /////////////////*/

.menuBase {
	width:940px;
	height:54px;
	background-color:#240038;
	border-radius:5px;
	margin:0 auto;
	box-shadow:0px 3px 10px 0px rgba(0,0,0,0.3);
	z-index:1;
}

.menuFixed {				/* ページ上端で固定するときにAddClass */
	position: fixed;
	width:100%;
	min-width:940px;
	top: 0;
	left:0;
	border-radius:0 0 0 0;
}

.menuHidden {
	display:none;
}

.menuContent {				/* メニューボタンの並び(正味)部分 */
	display:inline-block;
	margin:0 auto;
}

.mainBodyOffset {
	margin-top:54px;	/* 固定時オフセット＝メニューの高さ(menuBase) */
	
}

/* メニュー上の個別の反応領域 */

.menuTab {
	float:left;
	margin:0;
	padding:0;
}

.menuTab img {
	height:54px;
}



.menuTab:nth-child(6) {	/* Twitter */
	margin-left:13px;
}

.menuTab:hover {
	background-image:url('../img/menuOver.png');
	background-repeat:repeat-x;
}

.menuStay, .menuStay:hover {
	background-image:url('../img/menuStay.png');
	background-repeat:repeat-x;
	background-position:0 50px;
}



/*///////////////// 共通 フッタ /////////////////*/

.pageFooter {
	clear:both;
	background-image:url('../img/bg_stripe.png');
	background-repeat:repeat-x;
	width:840px;
	height:45px;
	display:block;
	margin:60px auto 0 auto;
}

.footerBtnDiv {
	width:840px;
	text-align:right;
	display:inline-block;
}

.footerTextDiv:after {
	text-align:center;
	color:#999;
	font-size:11px;
	line-height:30px;
	margin-top:-20px;
	display:block;
	content:"Copyright 2019 miraiyoga, Sapporo";
}

.footerNoButton {
	display:inline-block;
	margin-top:27px;
}

.mtEnough {
	margin-top:150px;
}


/*///////////////// TOPページ /////////////////*/



#emergency {
	width:400px;
	left:calc(50% - 200px);
	top:50%;
	-webkit-transform:translateY(-50%); /* Safari用 */
	transform:translateY(-50%);
	position:fixed;
	z-index:10000;
	background-color:#ffe0e0;
	border-radius:10px;
	text-align:left;
	padding:10px 20px;
	font-size:16px;
	line-height:24px;
	box-shadow:10px 10px 10px rgba(0,0,0,0.4);
	box-sizing:border-box;
}


/* クロスフェード画像 */

#IDtop_slide {
	width:100%;
	height:500px;
}

#IDtop_slide ul {
	margin:0;
	z-index:0;
}



/* ページ前半 */

.topSalesCopyDiv {
text-align:left; margin-top:40px; margin-left:-2px;
}

.topSubcopyDiv {
	width:560px;
	float:left;
	margin-top:40px;
}

.topSubcopyText {
	font-size:110%;
	line-height:185%;
}

.topPortraitDiv {
	float:right;
	margin:48px 0 0 20px;
	text-align:center;
}

.topPortraitNote {
	margin-top:6px;
	font-size:80%;
	line-height:140%;
}


/* ページ後半 */

.topBottomDiv {
	margin-top:60px;
}

.topBottomLeftDiv {
	width:350px;
	float:left;
}

.topBottomLeftDiv div {
	margin-top:25px;
}

.topBottomLeftDiv div:first-child {
	margin-top:0;
}

.topPhotoNote {
	margin-top:8px;
	vertical-align:top;
	text-align: justify;
	text-justify: inter-ideograph;	/* for IE */
	font-size:80%;
	line-height:160%;
}

.fb-page {
	margin-left:40px;
	border-top:1px solid #ddd;
	border-left:1px solid #ddd;
	border-right:2px solid #fff;
	border-bottom:2px solid #fff;
}

.imgYogaGene {
	width:88px;
	height:31px;
	margin-top:20px;
	float:right;
}

.imgYogaRoom {
	width:88px;
	height:31px;
	margin:20px 8px 0 0;
	border:none;
	float:right;
}



/*///////////////// ABOUTページ /////////////////*/

.divLabelSchool {
	text-align:left;
	margin-top:60px;
	margin-left:200px;
}

.imgAboutStudiophoto {
	float:right;
	margin-left:20px;
}

.divProfArea {
	background-image:url('../img/img_about_teacher.png');
	background-repeat:no-repeat;
	background-position:280px 0;
}

.divProfArea div {
	text-align:left;
	line-height:1.4em;
	margin-top:6px;
}

.divProfArea div:nth-child(2) {
	padding-top:70px;
}

.divProfArea div:nth-child(3) {
	padding-top:10px;
}

.divProfArea div:nth-child(5) {
	padding-bottom:30px;
}

.divProfArea div:first-letter {
	color:#0ac6c1;
	font-size:13px;
}

.imgProfilePhotoes {
	float:left;
	margin-right:40px;
	margin-bottom:20px;
}

.profText {
	font-size:100%;
	line-height:160%;
}



/*///////////////// ACCESSページ /////////////////*/

.divAccessMap {
	width:530px;
	margin-top:15px;
	float:left;
	text-align:right;
}

.imgAccessMap {
	float:right;
	margin-bottom:10px;
}


.divAccessPhoto {
	width:278px;
	float:right;
	padding-top:20px;
}

.divAccessPhoto p {
	padding:5px 0 8px 0;
	font-size:0.9em;
	line-height:1.3em;
}

.divAccessPhoto div {
	text-align:left;
	line-height:1.2em;
	color:#666;
}

.divFeeOrdinary {
	margin-top:60px;
	float:left;
	vertical-align:top;
	text-align:left;
	width:390px;
}

.divFeePrivate {
	margin-top:60px;
	float:right;
	vertical-align:top;
	text-align:left;
	width:390px;
}

.feeTable {
	width:390px;
	margin-top:20px;
}

.feeTable td {
	text-align:left;
	vertical-align:middle;
	padding:6px 0;
	height:45px;
	white-space:nowrap;
}

.feeTable td div {
	font-size:0.85em;
	line-height:1em;
	padding-left:2.5em;
	padding-bottom:0.4em;
	color:#000;
}

.feeTable tr td:first-child:first-letter {
	padding-left:15px;
	font-size:0.8em;
}

.feeTable tr td:last-child {
	text-align:right;
	padding-right:15px;
	vertical-align:bottom;
	font-family: 'Josefin Sans', sans-serif;
	font-size:40px;
	line-height:33px;
}

.feeTable tr td:last-child:first-letter {
	font-size:28px;
	letter-spacing:4px;
}

.taxNote {
	margin-top:10px;
	margin-bottom:-20px;
	text-align:left;
	line-height:1.2em;
	color:#999;
	text-align:right;
}

.private2nd {
	margin-top:8px;
}

.divFee {
	clear:both;
	padding-top:30px;
	vertical-align:top;
	text-align:left;
}

.divFee img:first-child {
	display:block;
	margin:0 0 20px 0;
}

.roundTitle {
	color:#fff;
	height:1.8em;
	line-height:1.8em;
	display:inline-block;
	border-radius:0.9em;
	padding:0 2em;
	background:#0ac6c1;
}

.divFeeOrdinary,
.divFeePrivate {
	margin:20px 0 0 0;
}


.divFeeOrdinary table {
	border:1px solid #0ac6c1;
}

.divFeePrivate table {
	border:1px solid #ffae45;
}

.feeTable tr:nth-child(odd) td {
	background-color:#fff;
}

.divFeeOrdinary .feeTable tr:nth-child(even) td {
	background-color:#e4fafa;
}

.divFeePrivate .feeTable tr:nth-child(even) td {
	background-color:#ffedd0;
}

.divFeePrivate .roundTitle {
	background:#ffae45;
}

.divFeeOrdinary .feeTable tr td:last-child,
.divFeeOrdinary .feeTable tr td:first-child:first-letter {
	color:#0ac6c1;
}

.divFeePrivate .feeTable tr td:last-child,
.divFeePrivate .feeTable tr td:first-child:first-letter {
	color:#ffae45;
}

.divFeePrivate a:link,
.divFeePrivate a:visited {
	color:#ffae45;
}

.divFeePrivate a:hover,
.divFeePrivate a:active {
	color: #da0c8a;
}

.divBaggage {
	clear:both;
	padding-top:40px;
	vertical-align:top;
	text-align:left;
}

.divBaggage img:first-child {
	display:block;
	margin:0 0 20px 0;
}

.divBaggage img:nth-child(2) {
	float:right;
}

.divBaggage p {
	float:left;
	width:400px;
}

.zeroYen {
	font-family: 'Josefin Sans', sans-serif;
	font-size:36px;
	padding-left:4px;
}

.zeroYenF {
	font-family: 'Josefin Sans', sans-serif;
	font-size:26px;
}


/*///////////////// SCHEDULEページ /////////////////*/


.lessonTypeLabel {
	display:inline-block;
	font-size:14px;
	padding-right:6px;
}

.lessonType {
	display:inline-block;
	background-color:#0ac6c1;
	color:#fff;
	border-radius:4px;
	padding:0 8px;
	position:relative;
}

.lessonType:hover {
	background-color:#575757;
	cursor:pointer;
}

.divSchedule ul {
	text-align:left;
	margin:8px 0 0 0;
	padding-left:0;
}

.divSchedule ul:first-child {
	margin:35px 0 0 0;
}

.divSchedule iframe {
	margin:30px 0 0 0;
}

.balloon {
	display: none;
	position:absolute;
	top:40px;
	left:-50px;
	width:340px;
	padding:10px 20px;
	border-radius: 5px;
	background: rgba(0,0,0,0.65);
	color: #fff;
	box-shadow:0px 3px 10px 0px rgba(0,0,0,0.3);
	font-size:15px;
	line-height:22px;
}

.balloon:before {
	content:"";
	position:absolute;
	left:20%;
	width:0;
	margin-top:-20px;
	height:0;
	border-left:10px solid transparent;
	border-right:10px solid transparent;
	border-bottom:10px solid rgba(0,0,0,0.65);
}

.lessonType:hover .balloon {
	display: block;
	z-index:10;
}


/* 連絡フォーム */

.divForm {
	float:right;
	vertical-align:top;
	text-align:left;
	width:600px;
}

.divForm img {
	margin:80px 0 25px 0;
}

.divForm table {
	margin:20px 0 20px 0;
	border-top:1px solid #0ac6c1;
	border-bottom:1px solid #0ac6c1;
	width:600px;
}

.divForm th {
	text-align:left;
	font-size:15px;
	font-weight:normal;
	white-space:nowrap;
}

.divForm th:first-letter {
	color:#0ac6c1;
	font-size:12px;
}

.divForm th,
.divForm td {
	padding:12px 0;
	border-top:1px dashed #0ac6c1;
	vertical-align:middle;
}

.divForm tr:first-child th,
.divForm tr:first-child td,
.divForm tr:last-child th,
.divForm tr:last-child td {
	border-top:none;
}

.divForm tr:last-child td {
	padding:0 0 20px 0;
	font-size:13px;
	line-height:17px;
	color:#777;
}

.divForm tr:last-child th div,
.divForm tr:last-child td div {
	text-align:right;
	padding-top:5px;
}

.divForm input[type="text"] {
	width:250px;
}

.divForm label {
	cursor:pointer;
}

textarea, input[type="text"] {
	margin:4px 0 0 0;
	padding:4px;
	width:96%;
	font-size:16px;
	background-color:#e4f7f6;
	border:solid 1px #82dad7;
}

textarea {
	width:470px;
	height:180px;
	box-sizing:border-box;
}


input[type="radio"] {
	margin:0 4px 0 0;
	cursor:pointer;
	width:20px;
	height:20px;
}

input[type="submit"],
input[type="button"] {
	-webkit-appearance: none;	/* iPad デザイン無効化 */
	font-size:16px;
	color:#fff;
	border-radius: 3px;
	box-shadow:0 2px 3px 0 rgba(0,0,0,0.3);
	margin:10px 0;
	padding:6px 30px;
	background-color:#0ac6c1;
	border:solid 1px #25aeaa;
	cursor:pointer;
	overflow : hidden;
	outline : none;
}

input[type="submit"]:hover,
input[type="button"]:hover {
	background: #cd009f;
	border:solid 1px #b8008f;
	cursor:pointer;
}

.formNote {
	float:right;
	display:inline-block;
}

.formNote p {
	font-size:13px;
	padding:0 0 5px 0;
	color:#777;
}

.formNote p span {
	color:#000;
	font-size:30px;
	font-family: 'Josefin Sans', sans-serif;
	line-height:30px;
	vertical-align:middle;
}

.formNote p:first-child {
	color:#099;
}


.emailnote {
	margin:8px 0 0 0;
	font-size:0.9em;
	line-height:1.1em;
	color:#c50f9d;
	background-color:#e4f7f6;
	text-align:center;
	padding:3px;
}


/* 以下 EXTRAページでも使用 */

.divListingNote {
	text-align:left;
	display:inline;
}

.divListingNote p {
	margin-top:6px;
	margin-bottom:0;
	line-height:20px;
}

.divListingNote p:first-child {
	margin-top:28px;
}

.divListingNote p:first-letter {
	color:#0ac6c1;
	font-size:13px;
}



/*///////////////// POSTMAILページ /////////////////*/


.confNote {
	margin:0 auto;
	padding-top:120px;
	text-align:left;
	display:inline-block;
}

.confNote img {
	margin-bottom:25px;
}


.confTable {
	margin:50px auto 50px auto;
	border-top:1px solid #0ac6c1;
	border-bottom:1px solid #0ac6c1;
	max-width:520px;
}

.confTable th {
	text-align:left;
	font-weight:normal;
	white-space:nowrap;
}

.confTable th:first-child {
	color:#0ac6c1;
	font-size:12px;
}

.confTable th:nth-child(2) {
	padding:0 20px 0 0;
}

.confTable td,th {
	text-align:left;
	padding:12px 0;
	border-top:1px dashed #0ac6c1;
}

.confTable tr:first-child td,
.confTable tr:first-child th {
	border-top:none;
}

.thanksNote {
	text-align:left;
	width:550px;
	margin:40px auto 20px auto;
	color:#777;
	font-size:15px;
	line-height:20px;
}

.thanksNote li {
	margin:10px 0;
	list-style-type:square;
	color:#0ac6c1;
	font-weight:bold;
}

.thanksNote ul {
	margin-bottom:30px;
}

.emailAddress a {
	font-size:30px;
	font-family: 'Josefin Sans', sans-serif;
}

.emailAddress a:hover {
	text-decoration:none;
}

.thanksBtn {
	padding-top:60px;
}

.msgDiv {
	border-top:1px solid #0ac6c1;
	border-bottom:1px solid #0ac6c1;
	text-align:center;
	padding:20px 0 20px 0;
	margin:50px 0 80px 0;
}

.msg {
	color:#c50f9d;
}

.msg:before {
	content:'※';
}


/*///////////////// EXTRAページ /////////////////*/



.extraPhrases {
	background-color:#fffcee;
	width:100%;
}

.extraPhrases div {
	float:left;
	box-sizing:border-box;
	padding:20px;
	margin-top:30px;
	text-align:justify;
	font-size:16px;
	line-height:30px;
	color:#444;
	border-radius:36px 4px 16px 4px;
}

.extraPhrases div span {
	font-size:1.4em;
	padding:0 2px;
}

.extraPhrases div:nth-child(1) {
	width:340px;
	margin-left:55px;
	background-color:#fffec5;
	border:1px solid #ffde00;
}

.extraPhrases div:nth-child(1) span {
	color:#d9bd00;
}

.extraPhrases div:nth-child(2) {
	width:340px;
	margin-left:50px;
	background-color:#ffedd7;
	border:1px solid #ffc889;
}

.extraPhrases div:nth-child(2) span {
	color:#eb7f00;
}

.extraPhrases div:nth-child(3) {
	clear:both;
	width:250px;
	background-color:#fbe1f5;
	border:1px solid #fab9ec;
}

.extraPhrases div:nth-child(3) span {
	color:#ee3ac6;
}

.extraPhrases div:nth-child(4) {
	width:250px;
	margin-left:45px;
	background-color:#d7f2ff;
	border:1px solid #9fd6ef;
}

.extraPhrases div:nth-child(4) span {
	color:#008dcf;
}

.extraPhrases div:nth-child(5) {
	width:250px;
	margin-left:45px;
	background-color:#cefabb;
	border:1px solid #a8e38f;
}

.extraPhrases div:nth-child(5) span {
	color:#39ba00;
}


.eventIconBase {
	display:inline-block;
	border-radius:4px;
	color:#fff;
	padding:4px 10px;
	font-size:0.95em;
	line-height:1.0em;
	margin-bottom:4px;
}

.eventSingle {
	background-color:#ff4477;
}

.eventRegular {
	background-color:#9955ff;
}






/* テーブル関連 */

.extraMenuFeeTable {
	width:100%;
	margin:30px 0 8px 0;
	border:1px solid #0ac6c1;
}


.extraMenuFeeTable tr td:first-child {
	width:450px;
	padding:15px 20px;
	background-color:#e4fafa;
}

.extraMenuFeeTable tr td:last-child {
	padding:15px 20px;
	text-align:left;
	background-color:#fff;
}

.vBottom {
	vertical-align:bottom;
}

.extraMenuTitle {
	color:#0ac6c1;
	font-size:1.2em;
	line-height:1.6em;
	margin-bottom:5px;
}

.extraMenuTitle:first-letter {
	font-size:0.75em;
	vertical-align:2px;
}

.extraMenuPara {
	font-size:0.9em;
	line-height:1.4em;
	padding-bottom:12px;
}

.extraMenuFee {
	text-align:right;
	font-family: 'Josefin Sans', sans-serif;
	font-size:50px;
	line-height:33px;
	color:#0ac6c1;
	margin:15px 0 10px 0;
}

.extraMenuFee:first-letter {
	font-size:0.7em;
	letter-spacing:4px;
}

.trafficFee {
	font-size:0.3em;
	font-weight:normal;
}

.campaign {
	margin:10px 0 6px 0;
	line-height:1.4em;
	color:#da0c8a;
}

.roundPanel {
	width:250px;
	height:250px;
	border-radius:50%;
	background-color:rgba(255,255,255,0.3);
	border:1px solid #0ac6c1;
	color:#0ac6c1;
	font-size:25px;
	line-height:32px;
	display:table-cell;
	vertical-align:middle;
	text-decoration:none;
	cursor:pointer;
}

.roundPanel span {
	font-size:19px;
	line-height:14px;
}

.roundPanel:hover {
	border:1px solid #da0c8a;
	color:#da0c8a;
}

.divRoundPanels {
	margin-top:40px;
	margin-bottom:40px;
}

.detailShown {
	display:block;
	box-sizing:border-box;
	position:fixed;
	background-color:#fff;
	width:880px;
	left:calc(50% - 440px);	/* width*0.5 */
	max-height:calc(100vh - 80px);	/* top*2 */
	top:40px;
	border:solid 1px #ccc;
	border-radius: 5px;
	box-shadow:0 6px 12px 0 rgba(0,0,0,0.8);
	z-index:1001;
	overflow:auto;
}

.detailHidden {
	display:none;
}

.screenShown {
	display:block;
	position:fixed;
	background-color:rgba(0,0,0,0.6);
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:1000;
	transition-duration:1.0s;
}

.screenHidden {
	display:block;
	position:fixed;
	background-color:rgba(0,0,0,0.0);
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:-1;
	transition-duration:0.3s;
}

.divOverwrap {
}

.divOverwrap h2 {
	margin-top:25px;
	font-size:23px;
}

.divOverwrap table {
	border:1px solid #0ac6c1;
	width:800px;
	margin:25px auto 0 auto;
}

.divOverwrap td {
	padding:7px 10px;
	line-height:23px;
	font-size:16px;
	text-align:left;
}

.divOverwrap tr:nth-child(even) td {
	background-color:#e4fafa;
}

.divOverwrap td:first-child:first-letter {
	color:#0ac6c1;
	font-size:0.8em;
}

.divOverwrap p {
	margin:20px 0 20px 60px;
}


.overwrapNote {
	width:760px;
	margin:20px 0 20px 60px;
	text-align:left;
	font-size:14px;
	line-height:20px;
}

.overwrapNote li {
	margin-left:20px;
}

.overwrapNote p {
	margin:10px 0 20px 20px;
}


.fixbody {
	overflow:hidden;
}

.flowbody {
	overflow:scroll;
}

.buttonHidden {
	display:none;
}


.divLabelVisit {
	text-align:left;
	margin-top:60px;
}