@charset "utf-8";
/*====================================*\
 * TOC / BREAKPOINTS
 *------------------------------------
 * Foundation
 * Layout
 * Object
 *  ├ Project
 *  ├ Components
 *  └ Utilities（原則編集禁止）
 * Pages  ･･･各ページ
 *------------------------------------
 * ブレークポイント一覧（モバイルファースト）
 *   max-width: 30em  ･･･ スマホ(480dp)
 * → min-width: 48em  ･･･ タブレット(768dp)
 * → min-width: 66.25em  ･･･ PC・大型タブレット(1060dp)
 *   min-width: 80em  ･･･ PCワイドディスプレイ(1280dp)
\*====================================*/


/*============================================================================*\
   $Foundation
\*============================================================================*/
html { font-size: 62.5%;}
body {
	background: #fff;
	color: rgba(0,0,0,.6);
	font-family: -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	font-size: 1.4em;
	line-height: 1.7;
	text-align: justify;
	text-justify: inter-ideograph;
}

a {
	color: #9b803d;
	text-decoration: underline;
	/*-webkit-tap-highlight-color: rgba(0, 0, 0, 0);*/
}
a,
button { transition: all .2s;}
a:focus,
a:hover { text-decoration: none; }
a img { transition: opacity .2s;}
a:focus img,
a:hover img { opacity: .8; }
a[target="_blank"]:after {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 .5em .25em;
	background: url(../../img/page/gcc/common/icon_blank.svg) no-repeat right top;
	vertical-align: middle;
}

@media (min-width: 48em) {
	body {
		font-size: 1.6em;
	
	}
}




/*============================================================================*\
   $Layout
\*============================================================================*/

.wrapper {
	position: relative;
	width: 100%;
	padding-right: 15px;
	padding-left: 15px;
	margin: 0 auto;
}

@media (min-width: 48em) {
	.wrapper {
		max-width: 73.75em; /* 1180px */
		padding-right: 60px;
		padding-left: 60px;
	}
	.wrapper--lg {
		max-width: 92.875em; /* 1486px */
	}
}




/*============================================================================*\
   $Object -- Project
\*============================================================================*/

/*------------------------------------*\
    ヘッダー
\*------------------------------------*/

.header {
	position: relative;
}

/* サイトタイトル */
.site-title {
	display: block;
	padding: 1rem 7rem 1rem 1.5rem;
	background: #ed86b3;
}
.site-title img {
	max-height: 3.8rem;
}

/* ナビゲーション */
.gnav__btn {
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	width: 5.8rem;
	height: 5.8rem;
	padding: 0;
	border: none;
	background: #fff;
	color: #ed86b3;
	font-size: 1.2rem;
	font-family: Georgia, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro","游明朝体", "YuMincho", "游明朝", "Yu Mincho", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	letter-spacing: .05em;
	text-align: center;
	cursor: pointer;
}
.gnav__btn:hover,
.gnav__btn:focus {
	background: #fae5ee;
}
.no-js .gnav__btn {
	display: none;
}
.gnav__btn:before {
	content: "";
	display: block;
	width: .8rem;
	height: .8rem;
	margin: 0 0 1.8rem 1.85rem;
	background: #ed86b3;
	box-shadow:
	1.3rem 1.3rem 0 0 #ed86b3,
	0 1.3rem 0 0 rgba(237,134,179,.5),
	1.3rem 0 0 0 rgba(237,134,179,.5);
	vertical-align: middle;
}
.gnav__list {
	border-bottom: .2rem solid #f2a8c8;
	background: #fae5ee;
	font-weight: bold;
	letter-spacing: .02em;
	-moz-font-feature-settings: "pkna";
	-webkit-font-feature-settings: "pkna";
	font-feature-settings: "pkna";
}
.gnav__list li + li {
	border-top: .2rem solid #f2a8c8;
}
.gnav__list a {
	display: block;
	padding: .858em 1em;
	color: #ed86b3;
	text-decoration: none;
}
.gnav__list a:focus,
.gnav__list a:hover {
	background: #f2a8c8;
	color: #fff;
}

@media (min-width: 30em) {
	/* サイトタイトル */
	.site-title {
		text-align: center;
	}
	
	/* ナビゲーション */
	.gnav__list:after {
		display: table;
		content: "";
		clear: both;
	}
	.gnav__list li {
		float: left;
		width: 33.33%;
	}
	.gnav__list li + li {
		border-top: none;
		border-left: .2rem solid #f2a8c8;
	}
	/* .gnav__list li:nth-child(n+3){
		border-top: .2rem solid #f2a8c8;
	}
	.gnav__list li:nth-child(2n){
		border-left: .2rem solid #f2a8c8;
	} */
}

@media (min-width: 48em) {
	/* サイトタイトル */
	.site-title {
		padding: 1.5rem 1.7rem 1.5rem 2.5rem;
	}
	.site-title img {
		height: 5rem;
		max-height: inherit;
	}
	
	/* ナビゲーション */
	.gnav__btn {
		width: 8rem;
		height: 8rem;
		font-size: 1.2rem;
	}
	.gnav__btn:before {
		width: 1rem;
		height: 1rem;
		margin: 0 0 2rem 2.75rem;
		box-shadow:
		1.5rem 1.5rem 0 0 #ed86b3,
		0 1.5rem 0 0 rgba(237,134,179,.5),
		1.5rem 0 0 0 rgba(237,134,179,.5);
	}
}

@media (min-width: 66.25em) {
	.header {
		position: fixed; /* jsトリガー */
		top: 0;
		z-index: 2;
		width: 100%;
	}
	
	/* サイトタイトル */
	.site-title {
		display: table-cell;
		width: 390px;
		padding: 18px 15px;
		background: rgba(237,134,179,.8);
		transition: .2s all;
	}
	.header--index .site-title {
		background: rgba(237,134,179,.6);
	}
	.header.is-fixed .site-title {
		background: rgba(237,134,179,.8);
	}
	.site-title img {
		height: auto;
	}
	
	/* ナビゲーション */
	.gnav {
		display: table;
		width: 100%;
	}
	.gnav__btn {
		display: none;
	}
	.gnav__list {
		padding-right: 30px;
		border-bottom: none;
		display: table-cell;
		vertical-align: middle;
		background: rgba(255,255,255,.6);
		text-align: right;
		transition: .2s all;
	}
	.header.is-fixed .gnav ul {
		background: rgba(255,255,255,.8);
	}
	.gnav__list li {
		display: inline-block;
		float: none;
		width: auto;
	}
	.gnav__list li:nth-child(n+3),
	.gnav__list li:nth-child(2n){
		border: none;
	}
	.gnav__list a {
		padding: 10px 20px;
		text-align: center;
		color: rgba(0,0,0,.6);
	}
	.gnav__list a:focus,
	.gnav__list a:hover {
		background: none;
		color: #9b803d;
	}
}


/*------------------------------------*\
    コンテンツ
\*------------------------------------*/
.content {
	background: #fff url(../../img/page/gcc/common/bg01.svg);
	background-size: 50%;
}
.section {
	margin-bottom: 20px;
}
.fill-section {
	padding-top: 20px;
	padding-bottom: 20px;
}

/* 見出し */
h1,h2,h3,h4,h5,h6 {
	margin: 0;
	font-size: inherit;
	-moz-font-feature-settings: "pkna";
	-webkit-font-feature-settings: "pkna";
	font-feature-settings: "pkna";
}
/* @note: line-heightをremで指定するとIEで崩れる */
.h1 {
	line-height: 1.4;
	color: #ed86b3;
	font-size: 1.8rem;
	letter-spacing: .1em;
	text-align: center;
}
.h1:after {
	content: "";
	display: block;
	margin: .4em auto 0;
	padding-top: 2.136752136752137%;
	background: url(../../img/page/gcc/common/bg_hcenter01.svg) no-repeat center center;
	background-size: 100% 100%;
}
.h2 {
	margin-bottom: 16px;
	line-height: 1.4;
	color: #ed86b3;
	font-size: 1.8rem;
	letter-spacing: .1em;
}
.h2:after {
	content: "";
	display: block;
	width: 100%;
	margin-top: .4em;
	padding-top: 2.136752136752137%;
	background: url(../../img/page/gcc/common/bg_hleft01.svg) no-repeat left center;
	background-size: 100% 100%;
}
.h2--reverse {
	color: #fff;
}
.h2--reverse:after {
	background-image: url(../../img/page/gcc/common/bg_hleft02.svg); 
}
.h2--secondary:after {
	background-image: url(../../img/page/gcc/common/bg_hleft03.svg);
}
.h2--no-line {
	padding-bottom: 0;
}
.h2--no-line:after {
	content: none;
}
.h3 {
	margin-bottom: 15px;
	padding: .528em .9em;
	border: .2rem solid #ed86b3;
	background: #ed86b3;
	line-height: 1.416;
	font-size: 1.4rem;
	letter-spacing: .1em;
	color: #fff;
}
.h3--secondary {
	border-color: #9b803d;
	background: #9b803d;
}
.h3--outline {
	border: .2rem solid;
	background: none;
	color: #ed86b3;
}
.h3--secondary.h3--outline {
	color: #9b803d;
}
.h3:before {
	content: "";
	display: inline-block;
	width: .7rem;
	height: .7rem;
	margin: 0 1em .6em 0;
	background: #fff;
	box-shadow:
	.7rem .7rem 0 0 #fff,
	0 .7rem 0 0 rgba(255,255,255,.3),
	.7rem 0 0 0 rgba(255,255,255,.3);
	vertical-align: middle;
}
.h3--outline:before {
	background: #ed86b3;
	box-shadow:
	.7rem .7rem 0 0 #ed86b3,
	0 .7rem 0 0 rgba(237,134,179,.2),
	.7rem 0 0 0 rgba(237,134,179,.2);
}
.h3--secondary.h3--outline:before {
	background: #9b803d;
	box-shadow:
	.7rem .7rem 0 0 #9b803d,
	0 .7rem 0 0 rgba(155,128,61,.2),
	.7rem 0 0 0 rgba(155,128,61,.2);
}
.h4 {
	margin-bottom: 10px;
	padding: .417em 1em;
	background: #f2a8c8;
	line-height: 1.416;
	font-size: 1.4rem;
	font-weight: 700;
	color: #fff;
	letter-spacing: .1em;
}
.h4--reverse {
	background: #fff;
	color: #ed86b3;
}
.h5 {
	font-weight: 700;
}

/* ページヘッダー */
.page-header {
	padding: 20px 0 25px;
	background: #fae5ee;
}

@media (min-width: 30em) {
	/* 見出し */
	.h1:after {
		width: 327.6px; /* 70% */
		height: 7px;
		padding-top: 0;
	}
	.h2:after {
		width: 327.6px; /* 70% */
		height: 7px;
		padding-top: 0;
	}
}

@media (min-width: 48em) {
	.content {
		background-size: auto;
	}
	.section {
		margin-bottom: 60px;
	}
	.fill-section {
		padding-top: 60px;
		padding-bottom: 60px;
	}
	
	/* 見出し */
	.h1 {
		font-size: 4rem;
	}
	.h1:after {
		width: 468px;
		height: 10px;
		margin-top: .25em;
	}
	.h2 {
		margin-bottom: 40px;
		font-size: 3.6rem;
	}
	.h2:after {
		width: 468px;
		height: 10px;
		margin-top: .3em;
	}
	.h2--small {
		margin-bottom: 30px;
		font-size: 3rem;
	}
	.h2--small:after {
		width: 426px;
	}
	.h2--xsmall {
		margin-bottom: 20px;
		font-size: 2rem;
	}
	.h2--no-line {
		padding-bottom: 0;
	}
	.h3 {
		margin-bottom: 30px;
		font-size: 1.8rem;
	}
	.h4 {
		margin-bottom: 20px;
		font-size: 1.8rem;
	}
	
	/* ページヘッダー */
	.page-header {
		padding-top: 50px;
		padding-bottom: 65px;
	}
}

@media (min-width: 66.25em) {
	/* ページヘッダー */
	.page-header {
		padding-top: 160px;
	}
}


/*------------------------------------*\
    フッター
\*------------------------------------*/
.footer {
	background: #9b803d;
	color: #fff;
}

/* お問い合わせ */
.contact {
	padding-top: 20px;
	padding-bottom: 20px;
	background: rgba(255,255,255,.2)
}
.copyright__scool-name {
	max-width: 200px;
	margin: 0 auto 5px;
}
.contact-txt {
	margin: 0;
	text-align: center;
}
.contact-btn {
	margin-left: 1em;
}

/* コピーライト */
.copyright {
	padding-top: 20px;
	padding-bottom: 20px;
	font-size: 100%;
	font-family: Georgia, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro","游明朝体", "YuMincho", "游明朝", "Yu Mincho", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	text-align: center;
}
.copyright small {
	font-size: 100%;
}

/* ページ上部に戻る */
.footer-page-top {
	margin-bottom: 0;
	font-family: Georgia, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro","游明朝体", "YuMincho", "游明朝", "Yu Mincho", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	letter-spacing: .1em;
	text-align: center;
}
.footer-page-top a {
	display: block;
	padding-top: 20px;
	padding-bottom: 20px;
	background: rgba(255,255,255,.2);
	color: #fff;
	text-decoration: none;
}
.footer-page-top a:before {
	content: "";
	display: inline-block;
	width: .8em;
	height: .8em;
	margin: .1em 1em 0 0;
	border-top: .2rem solid #fff;
	border-right: .2rem solid #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	vertical-align: middle;
}
.footer-page-top a:hover,
.footer-page-top a:focus {
	background: rgba(255,255,255,.3);
}

@media (min-width: 48em) {
	/* お問い合わせ */
	.contact {
		padding-top: 25px;
		padding-bottom: 25px;
	}
	.contact-inner {
		display: table;
		width: 100%;
	}
	.contact-heading,
	.contact-txt {
		display: table-cell;
		vertical-align: middle;
	}
	.contact-heading {
		width: 50%;

	}
	.contact-txt {
		width: 55%;
		padding-left: 4%;
		text-align: right;
	}

	/* コピーライト */
	.copyright {
		padding-top: 25px;
		padding-bottom: 25px;
	}
	
	/* ページ上部に戻る */
	.footer-page-top a {
		padding-top: 25px;
		padding-bottom: 25px;
	}
	.footer-page-top a:before {
		border-top-width: .3rem;
		border-right-width: .3rem;
	
	}
}

@media (min-width: 66.25em) {
	/* ページ上部に戻る */
	.footer-page-top {
		display: none;
	}
}




/*============================================================================*\
   $Object -- Components
\*============================================================================*/

/*------------------------------------*\
    Tables
\*------------------------------------*/
table {
	width: 100%;
	max-width: 100%;
	margin: 0;
	border-collapse : separate;
	border-spacing: 10px;
	text-align: justify;
	text-justify: inter-ideograph;
}
.csscalc table {
	width:calc(100% + 20px);
	max-width: calc(100% + 20px);
	margin: -10px;
}
th,
td {
	padding: .417em 1em;
	text-align: inherit;
}
td { border-bottom: .1rem solid #f2a8c8; }
th {
	background: #f4f4f4;
	font-weight: normal;
}
[scope="colgroup"] { background: #fae5ee;}

/* テーブルキャプション */
caption { padding: 8px 0; font-size: .875em; font-size: calc(1em - 2px); }
caption[data-position="top"] { caption-side: top; }
caption[data-position="bottom"] { caption-side: bottom; }
caption[data-align="center"] { text-align: center; }
caption:before { content: attr(data-prefix); font-weight: bold; }

/* ボーダー付き */
.table-bordered thead th,
.table-bordered thead td { border: none; background: #fae5ee; }
.table-bordered th {
	background: none;
	border-bottom: 1px solid #f2a8c8;
}

/* ボーダーなし */
.table-no-border th,
.table-no-border td {
	border: none;
	background: none;
}

/* スタイルなし */
.table-no-style { width: auto; }
.table-no-style th,
.table-no-style td { background: none; padding: 0; border: none; }

/* レスポンシブ */
@media only screen and (max-width:47.9375em) {
	.table-responsive {
		display: block;
		width: 100%;
		overflow-x: scroll;
		-webkit-overflow-scrolling: touch;
	}
	.table-responsive table { margin-bottom: 4px; }
	.table-responsive td,
	.table-responsive th {
		padding: 6px 10px;
		border: 1px solid #ddd;
		white-space: nowrap;
	}
}
.table-responsive::-webkit-scrollbar{ height:6px; }
.table-responsive::-webkit-scrollbar-track{-webkit-box-shadow:none;box-shadow:none;background-color:#eee}
.table-responsive::-webkit-scrollbar-thumb{background-color:#4d4d4d}


/*------------------------------------*\
    Buttons
\*------------------------------------*/
.btn {
	display: inline-block;
	overflow: visible;
	position: relative;
	max-width: 100%;
	margin-right: 7px;
	margin-bottom: 7px;
	padding: .858em 1em;
	border: .2rem solid #ed86b3; /* 2px */
	border-radius: 0;
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
	text-decoration: none !important;
	vertical-align: middle;
	-moz-font-feature-settings: "pkna";
	-webkit-font-feature-settings: "pkna";
	font-feature-settings: "pkna";
	letter-spacing: .1em;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	transition: all .2s ease;

	/* base theme */
	box-shadow: 7px 7px 0px 0px rgba(237,134,179,.2);
	background-color: #fff;
	color: #ed86b3;
}
.btn:not(:disabled) {
	cursor: pointer;
}
.btn[target="_blank"]:after {
	background-position: center top;
}

.btn:focus,
.btn:hover {
	background-color: #ed86b3;
	color: #fff;
}
.btn:active {
	border-color: #f2a8c8;
	background-color: #f2a8c8;
}
.btn[target="_blank"]:focus:after,
.btn[target="_blank"]:hover:after {
	background-position: left top;
}

/* Sizes */
.btn--large { 
	font-size: 1.8rem;
}
.btn--small {
	padding: .438em 1em;
	font-size: 1.2rem;
}

/* List */
.btn-list {
	list-style: none;
	table-layout: fixed;
	width: 100%;
	padding: 0;
}
.btn-list li + li {
	margin-top: 4%;
}
.btn-list .btn {
	display: block;
}

@media (min-width:48em) {
	.btn {
		margin-right: 10px;
		margin-bottom: 10px;
		border-width: .3rem;
		padding: 1.3615em;
		font-size: 1.8rem;
		
		/* base theme */
		box-shadow: 10px 10px 0px 0px rgba(237,134,179,.2);
	}
	.btn--small {
		padding: .438em 1em;
		font-size: 1.6rem;
	}
	
	/* Width */
	.btn-w-md {
		width: 32.5rem; /* 325px */
	}
	
	/* List */
	.btn-list:after {
		content: "";
		display: block;
		clear: both;
	}
	.btn-list li {
		float: left;
		width: 50%;
	}
	.btn-list li + li {
		margin-top: 0;
	}
	.btn-list li:nth-child(n + 3) {
		margin-top: -.3rem;
	}
	.btn-list li:nth-child(2n+1) .btn {
		border-right-width: 0;
	}
	.btn-list li:only-child .btn {
		border-right-width: .3rem;
	}
	.btn-list-item-w100 {
		width: 100%!important;
	}
	.btn-list-item-second-line {
		margin-top: -.3rem!important;
	}
	.btn-list-item-w100 .btn,
	.btn-list-item-right .btn {
		border-right-width: .3rem!important;
	}
	.btn-list-item-left .btn {
		border-right-width: 0!important;
	}
	.btn-list .btn {
		margin: 0;
	}
}

/* Theme */
.btn--reverse {
	border-color:#fff;
	background: #ed86b3;
	box-shadow: 10px 10px 0px 0px rgba(255,255,255,.2);
	color: #fff;
}
.btn--reverse:focus,
.btn--reverse:hover {
	border-color: #ed86b3;
	background-color: #fff;
	color: #ed86b3;
}
.btn--reverse:active {
	background-color: #fae5ee;
}
.btn--reverse[target="_blank"]:after,
.btn--reverse[target="_blank"]:after {
	background-position: left top;
}
.btn--reverse[target="_blank"]:focus:after,
.btn--reverse[target="_blank"]:hover:after {
	background-position: center top;
}

.btn--clear {
	border-color: transparent;
	background-color: transparent;
	box-shadow: none;
}
.btn--clear:focus,
.btn--clear:hover {
	background-color: rgba(237,134,179,.2);
	color: #ed86b3;
}
.btn--clear:active {
	border-color: #ed86b3;
	background-color: #ed86b3;
	color: #fff;
}
.btn--clear[target="_blank"]:focus:after,
.btn--clear[target="_blank"]:hover:after {
	background-position: center top;
}
.btn--clear[target="_blank"]:active:after {
	background-position: left top;
}

.btn--outline {
	background-color: transparent;
	box-shadow: none;
}
.btn--outline.btn--reverse:focus,
.btn--outline.btn--reverse:hover {
	border-color: #fff;
	color: #ed86b3;
}

.btn.disabled,
.btn:disabled {
	border-color: #e1e1e1;
	background-color: #e1e1e1;
	color: #aaa;
	pointer-events: none;
}
.btn.disabled:hover { background-color: #e1e1e1;}


/*------------------------------------*\
    Label
\*------------------------------------*/
.label {
	display: inline-block;
	margin-right: 1em;
	margin-left: 1em;
	padding: .25em .5em;
	border: .2rem solid; /* 2px */
	letter-spacing: .05em;
	line-height: 1.3;
	font-size: .875em;
	font-weight: bold;
	vertical-align: middle;
}

@media (max-width:29.9375em) {
	.label--category {
		display: block;
		margin: 0 0 5px 0;
		text-align: center;
	}
}
@media (min-width:30em) {
	.label--category {
		width: 10rem;
		text-align: center;
	}
}


/*------------------------------------*\
   List
\*------------------------------------*/
/* ハイフン */
.list-hyphen {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}
.list-hyphen > li {
	padding-left: 1.125em;
	text-indent: -1.125em;
}
.list-hyphen > li:before {
	content: "";
	display: inline-block;
	width: .625em; /* フォントサイズ16px = 10px */
	height: .1875em; /* フォントサイズ16px = 3px */
	margin: 0 .5em .3em 0;
	background: #ed86b3;
	vertical-align: middle;
}

/* 数字 */
.list-cnt {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}
.list-cnt > li {
	counter-increment: cnt;
	padding-left: 2.0625em;
	text-indent: -2.0625em;
}
.list-cnt > li + li {
	margin-top: .5em;
}
.list-cnt > li:before {
	content: counter(cnt);
	display: inline-block;
	margin-right: .5em;
	width: 1.858em;
	padding: .143em 0;
	background: #ed86b3;
	color: #fff; 
	font-size: .875em;
	font-weight: bold;
	text-align: center;
	text-indent: 0;
}
.list-cnt-num {
	display: inline-block;
	margin-right: .5em;
	margin-left: .5em;
	width: 1.858em;
	padding: .143em 0;
	background: #ed86b3;
	color: #fff; 
	font-size: .875em;
	font-weight: bold;
	text-align: center;
	text-indent: 0;
}


/*------------------------------------*\
   Box
\*------------------------------------*/
.box {
	padding: 15px;
}
.box--primary {
	background-color: #ed86b3;
	color: #fff;
}

@media (min-width: 48em) {
	.box {
		padding: 40px;
	}
}

@media (min-width: 66.25em) {
	.box {
		padding: 60px;
	}
}


/*------------------------------------*\
   Japanese-style bracket
\*------------------------------------*/
.jp-bracket {
	position: relative;
	padding: 20px 15px;
}
.jp-bracket--p0 {
	padding: 0!important;
}
.jp-bracket:before,
.jp-bracket:after {
	content:"";
	display: block;
	position: absolute;
	z-index: 1;
	width: 50px;
	height: 50px;
	border-style: solid;
}
.jp-bracket:before {
	top: 0;
	left: 0;
	border-width: 5px 0 0 5px;
}
.jp-bracket:after {
	right: 0;
	bottom: 0;
	border-width: 0 5px 5px 0;
}
.jp-bracket--primary:before,
.jp-bracket--primary:after {
	border-color: #ed86b3;
}
.jp-bracket--secondary:before,
.jp-bracket--secondary:after {
	border-color: #fae5ee;
}

/* 受賞者の声 */
.jp-bracke__heading {
	margin-bottom: 10px;
	color: #ed86b3;
	text-align: center;
}

@media (min-width: 30em) {
	.jp-bracket:before,
	.jp-bracket:after {
		width: 100px;
		height: 100px;
	}
}

@media (min-width: 48em) {
	.jp-bracket {
		padding: 50px 40px;
	}
	.jp-bracket + .jp-bracket {
		margin-top: 0;
	}
	.jp-bracket:before,
	.jp-bracket:after {
		width: 150px;
		height: 150px;
	}
	.jp-bracket:before {
		border-width: 10px 0 0 10px;
	}
	.jp-bracket:after {
		border-width: 0 10px 10px 0;
	}
	.jp-bracke__heading {
		margin-bottom: 30px;
	}
	.jp-bracke__txt {
		font-size: 1.4rem;
	}
}

@media (min-width: 66.25em) {
	.jp-bracket {
		padding: 70px 60px;
	}
}


/*------------------------------------*\
   Award heading
\*------------------------------------*/
.award-heading {
	max-width: 10em;
	margin: 0 auto 10px;
	font-size: 1.6rem;
	line-height: 1;
}
.award-heading:before {
	content: "";
	display: inline-block;
	float: left;
	background: url(../../img/page/gcc/common/icon_award.svg) no-repeat;
	vertical-align: middle;
	width: 2.5rem;
	height: 2.1rem;
	margin-right: .5em;
	margin-top: -.1em;
	background-size: 7.5rem 2.1rem;
}
.award-heading--silver:before {
	background-position: -2.5rem 0;
}
.award-heading--copper:before {
	background-position: -5rem 0;
	}
.award-heading:after {
	content: "";
	display: block;
	clear: both;
}
.award-heading__name {
	float: left;
	display: flex;
	color: #9b803d;
	min-width: 5em;
	letter-spacing: .1em;
	justify-content: space-between;
}
.award-heading-cnt {
	display: inline-block;
	float: left;
	width: 3.583333333333333em;
	height: 1.8em;
	margin-left: 1em;
	border-radius: 50%;
	background: #fae5ee;
	vertical-align: middle;
	text-align: center;
	font-size: 1rem;
	line-height: 1.8em;
}
.award-heading-cnt__num {
	font-size: 1.2rem;
}
@media (min-width: 48em) {
	.award-heading {
		margin-bottom: 20px;
		max-width: 17em;
	}
	.award-heading:before {
		width: 5rem;
		height: 4.2rem;
		margin-right: 1em;
		margin-top: -.5em;
		background-size: 15rem 4.2rem;
	}
	.award-heading--silver:before {
		background-position: -5rem 0;
	}
	.award-heading--copper:before {
		background-position: -10rem 0;
	}
	.award-heading__name {
		font-size: 3rem;
	}
	.award-heading-cnt {
		height: 2.5em;
		font-size: 1.2rem;
		line-height: 2.5em;
	}
	.award-heading-cnt__num {
		font-size: 1.6rem;
	}
}

/*------------------------------------*\
   Balloon
\*------------------------------------*/
.balloon {
	position: relative;
	padding: 10px;
	background: #fae5ee;
	color: #ed86b3;
}
.balloon:before {
	content: "";
	position: absolute;
	bottom: -25px;
	left: 30px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 25px 25px 0;
	border-color: transparent #fae5ee transparent transparent;
}
@media (min-width: 48em) {
	.balloon {
		padding: 25px 40px;
	}
}

/*------------------------------------*\
   Card
\*------------------------------------*/
.card {
	display: block;
	background: #fff;
	color: rgba(0,0,0,.6);
	text-decoration: none;
	box-shadow: 7px 7px 0px 0px rgba(255,255,255,.2);
}
.card__img {
	display: block;
	overflow: hidden;
	background: #ed86b3;
}
.card__img img {
	width: 100%;
	transition: transform .2s;
}
a.card:focus .card__img img,
a.card:hover .card__img img {
	transform: scale(1.2,1.2)
}
.card__txt {
	display: block;
	padding: 10px 15px;
}

@media (min-width: 48em) {
	.card {
		box-shadow: 10px 10px 0px 0px rgba(255,255,255,.2);
	}
	.card__txt {
		display: block;
		padding: 15px;
	}
}

/*------------------------------------*\
   Image
\*------------------------------------*/
.img-border {
	position: relative;
}
.img-border:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .067); /* #eee */
}
.img-border img {
	width: 100%;
}




/*============================================================================*\
    $Object -- Utilities（原則編集禁止）
\*============================================================================*/

/* Clearing */
.clr { clear: both;}
.clearfix:after { content: ""; display: block; clear: both; }

/*  Float */
.u-left { float: left;}
.u-right { float: right;}
.u-center { margin-right: auto; margin-left: auto; }

/* widths */
.u-w100 { width: 100%; }
.u-w80 { width: 80%; }
.u-w75 { width: 75%; }
.u-w66 { width: 66%; }
.u-w60 { width: 60%; }
.u-w50 { width: 50%; }
.u-w40 { width: 40%; }
.u-w33 { width: 33%; }
.u-w25 { width: 25%;}
.u-w20 { width: 20%; }
.u-w10 { width: 10%; }
 
/* Lists */
/*ul,ol*/.list-flat,
/*ul,ol*/.list-inline { list-style: none; padding-left: 0; }
/*ul,ol*/.list-inline li { display: inline; margin-right: .5em; }
/*dl*/.list-flat dt { font-weight: normal; }
/*dl*/.list-flat dd { margin-left: 0; }

/* Text Indents */
.u-indent1,
li.u-indent1,
ul.u-indent1 > li { padding-left: 1em; text-indent: -1em; }
ul.u-indent1 { list-style: none; padding-left: 0; text-indent: 0; }

/* Text Align & Font style */
.u-text-primary    { color: #ed86b3; }
.u-text-secondary  { color: #f2a8c8; }
.u-text-tertiary   { color: #fae5ee; }
.u-text-quaternary { color: #9b803d; }
.u-text-left   { text-align: left; }
.u-text-center { text-align: center; }
.u-text-right  { text-align: right; }
.u-text-justify { text-align: justify; }
.u-bold { font-weight: 700; }
.u-thin { font-weight: 400; }
.u-font-italic { font-style: italic; }
.u-font-normal { font-style: normal; }

@media (min-width:30em) {
	.u-text-left-sm   { text-align: left; }
	.u-text-center-sm   { text-align: center; }
	.u-text-right-sm   { text-align: right; }
}

/* Text Styles */
.u-size-xxl { font-size: 2rem; }
.u-size-xl { font-size: 1.8rem; }
.u-size-l { font-size: 1.6rem; }
.u-size-m { font-size: 1.4rem; }
.u-size-s { font-size: 1.2rem; }
.u-size-xs { font-size: 1rem; }

@media (min-width: 48em) {
	.u-size-xxxl { font-size: 3.6rem; }
	.u-size-xxl { font-size: 3rem; }
	.u-size-xl { font-size: 2rem; }
	.u-size-l { font-size: 1.8rem; }
	.u-size-m { font-size: 1.6rem; }
	.u-size-s { font-size: 1.4rem; }
	.u-size-xs { font-size: 1.2rem; }
}

/* Margins */
.mt5 { margin-top:    .5rem!important; }
.mb5 { margin-bottom: .5rem!important; }
.mts { margin-top:    1rem!important; }
.mrs { margin-right:  1rem!important; }
.mbs { margin-bottom: 1rem!important; }
.mls { margin-left:   1rem!important; }
.mtm { margin-top:    1.5rem!important; }
.mrm { margin-right:  1.5rem!important; }
.mbm { margin-bottom: 1.5rem!important; }
.mlm { margin-left:   1.5rem!important; }
.mtl { margin-top:    2rem!important; }
.mrl { margin-right:  2rem!important; }
.mbl { margin-bottom: 2rem!important; }
.mll { margin-left:   2rem!important; }
.mtxl { margin-top:    2rem!important; }
.mrxl { margin-right:  2rem!important; }
.mbxl { margin-bottom: 2rem!important; }
.mlxl { margin-left:   2rem!important; }
.mtxxl { margin-top:    2rem!important; }
.mrxxl { margin-right:  2rem!important; }
.mbxxl { margin-bottom: 2rem!important; }
.mlxxl { margin-left:   2rem!important; }
.m0,.mt0,.mv0 { margin-top:    0!important; }
.m0,.mr0,.mh0 { margin-right:  0!important; }
.m0,.mb0,.mv0 { margin-bottom: 0!important; }
.m0,.ml0,.mh0 { margin-left:   0!important; }

@media (min-width: 48em) {
	.mtl { margin-top:    3rem!important; }
	.mrl { margin-right:  3rem!important; }
	.mbl { margin-bottom: 3rem!important; }
	.mll { margin-left:   3rem!important; }
	.mtxl { margin-top:    4rem!important; }
	.mrxl { margin-right:  4rem!important; }
	.mbxl { margin-bottom: 4rem!important; }
	.mlxl { margin-left:   4rem!important; }
	.mtxxl { margin-top:    6rem!important; }
	.mrxxl { margin-right:  6rem!important; }
	.mbxxl { margin-bottom: 6rem!important; }
	.mlxxl { margin-left:   6rem!important; }
}

/* Paddings */
.pt0 { padding-top:    0!important; }
.pb0 { padding-bottom: 0!important; }

/* Display Utility */
.u-hidden { display: none; }
[class^="u-visible"] { display: none; }
.u-inline { display: inline; }
.u-ib     { display: inline-block; }
.u-block  { display: block; }

@media (min-width:30em) {
	.u-hidden-sm  { display: none!important; }
	.u-visible-sm { display: block!important; }
	.u-visible-sm--inline { display: inline!important; }
	.u-visible-sm--ib { display: inline-block!important; }
}
@media (min-width:48em) {
	.u-hidden-md  { display: none!important; }
	.u-visible-md { display: block!important; }
	.u-visible-md--inline { display: inline!important; }
	.u-visible-md--ib { display: inline-block !important; }
}
@media (min-width: 66.25em) {
	.u-hidden-lg  { display: none!important; }
	.u-visible-lg { display: block!important; }
	.u-visible-lg--inline { display: inline!important; }
	.u-visible-lg--ib { display: inline-block!important; }
}
@media (min-width:80em) {
	.u-hidden-xl  { display: none!important; }
	.u-visible-xl { display: block!important; }
	.u-visible-xl--inline { display: inline!important; }
	.u-visible-xl--ib { display: inline-block!important; }
}
@media print {
	.u-hidden-print  { display: none!important; }
	.u-visible-print { display: inline!important; }
	.u-visible-print--inline { display: inline!important; }
	.u-visible-print--ib { display: inline-block!important; }
}

/* Only for screen readers */
.u-sr {
	overflow: hidden;
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	width: 1px;
}
a.u-sr:focus,
.u-sr:focus {
	display: block;
	top: 5px;
	left: 5px;
	clip: auto !important;
	z-index: 100000; /* Above WP toolbar. */
	width: auto;
	height: auto;
	padding: 15px 23px 14px;
	box-shadow: 0 0 2px 2px rgba(237,134,179,.5);
	background-color: #f1f1f1;
	color: #ed86b3;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: normal;
	text-decoration: none;
}
 
/* Word break */
.u-wbr {
	white-space: nowrap;
	display: inline-block;
}