@charset "utf-8";

/*
************************************************************************
* デザイン・レイアウト基本設定
* @copyright Revolme Inc.
*
* レイアウトの設定
************************************************************************
*/

/*
************************************************************************
* レスポンシブ別表示切り替え
************************************************************************
*/
@media screen and (max-width:640px)
{
	.pc-visible  {display:none !important;}
	.pc-tab-visible  {display:none !important;}
	.tab-visible {display:none !important;}
	.sp-hide     {display:none !important;}
}
@media screen and (min-width:641px) and (max-width:1320px)
{
	.pc-visible  {display:none !important;}
	.tab-hide    {display:none !important;}
	.sp-visible  {display:none !important;}
}
@media screen and (min-width:1321px)
{
	.pc-hide     {display:none !important;}
	.tab-visible {display:none !important;}
	.sp-visible  {display:none !important;}
}

/*
************************************************************************
 フォント
************************************************************************
*/
.ff-noto_sans{font-family:"Noto Sans JP", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; font-weight:400;}
.ff-noto_sans_thin{font-family:"Noto Sans JP", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; font-weight:300;}
.ff-noto_serif{font-family:"Noto Serif JP", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; font-weight:400;}
.ff-noto_serif_thin{font-family:"Noto Serif JP", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; font-weight:300;}
.ff-pathway{font-family:'Pathway Gothic One', "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; font-weight:300;}


.fw-700 {font-weight: 700;}
.fw-500 {font-weight: 500;}
.fw-400 {font-weight: 400;}
.fw-350 {font-weight: 350;}
.fw-300 {font-weight: 300;}
.fw-100 {font-weight: 100;}
.fw-bold{font-weight:bold;}

.fc-red{color:#CC0000;}
.fc-white{color:#FFFFFF;}

.fs-s{font-size:0.9em;}
.fs-l{font-size:1.2em;}
.fs-ll{font-size:1.5em;}

/*
************************************************************************
 リンク
************************************************************************
*/

a.link-text {
	color: #3885FF;
	font-weight: bold;
	text-decoration: underline;
}
a.link-text:hover {
	text-decoration: none;
}

/*
************************************************************************
 リスト
************************************************************************
*/
ul.flex-list
{
	display: flex;
	flex-wrap: wrap;
	margin:-0.5em;

	padding:0;
	list-style:none;
}
ul.flex-list li
{
	padding:0;
	margin:0.5em;
	list-style:none;
	line-height:1;
}

/*
************************************************************************
 テキスト
************************************************************************
*/

.ta-left{text-align: left;}
.ta-center{text-align: center;}
.ta-right{text-align: right;}
.ta-just{text-align: justify;text-justify: inter-ideograph;}
.ta-last-just{text-align-last: justify;text-justify:inter-ideograph;}



/*
************************************************************************
 角丸
************************************************************************
*/
.rd-10 {border-radius: 10px;}
.rd-20 {border-radius: 20px;}
.rd-30 {border-radius: 30px;}


/*
************************************************************************
 マージン
************************************************************************
*/
.mt         {margin-top:50px}
.mb         {margin-bottom:50px}

.mt-1em     {margin-top:1em}
.mb-1em     {margin-bottom:1em}

/* ################################################################################################ */
/* ## 中型                       ################################################################## */
/* ################################################################################################ */
@media screen and (max-width:1320px) {
}

/* ################################################################################################ */
/* ## スマホサイト用スタイル ###################################################################### */
/* ################################################################################################ */
@media screen and (max-width:640px) {
	.mt         {margin-top:6.25vw}
	.mb         {margin-bottom:6.25vw}

	.rd-10 {border-radius: 1.5625vw;}
	.rd-20 {border-radius: 3.125vw;}
	.rd-30 {border-radius: 4.6875vw;}

}
