@charset "utf-8";

/*
This file make sure : common.css
Author : TALES WORKS
Author URI : https://talesworks.com/
Last Renew : 更新履歴を記載　2020/11/26/
*/


/*------------------index---------------------

/ /* Component
/ /* Project
/ /* Utility

/
----------------------------------------------*/

/* ========================================== */
/* Component
/* ========================================== */

/* Headline
--------------------------------------*/



/* ========================================== */
/* BOX
/* ========================================== */
/*
flex                親要素に使用できるプロパティ
---------------------------------------------
flex-direction      アイテムの並び順を指定する
flex-wrap           アイテムの折り返しを指定する
flex-flow           アイテムの並び順と折り返しを一括で指定する
justify-content     アイテムの水平方向の位置を指定する
align-items         アイテムの垂直方向の位置を指定する
align-content       アイテムの行の垂直方向の位置を指定する
*/
.p_flex-wrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap; 
}
.p_flex-nowrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
/*
flex-direction      アイテムを配置する向きを指定するプロパティ
---------------------------------------------
row                 アイテムを水平方向に左から右へと配置（デフォルト）
row-reverse         アイテムを水平方向に右から左へと配置
column              アイテムを垂直方向に上から下へと配置
colmn-reverse       アイテムを垂直方向に下から上へと配置
*/
.p_row-reverse    { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }
.p_column         { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
.p_column-reverse { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }
/*
flex-wrap           アイテムの折り返しを指定するプロパティ
---------------------------------------------
nowrap              アイテムを折り返さずに一列に配置（デフォルト）
wrap                複数行のアイテムを上から下へと配置
wrap-reverse        複数行のアイテムを下から上へと配置
*/
.p_wrap-rev     { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }
/*
justify-content     水平方向の位置を指定するプロパティ
---------------------------------------------
flex-start          アイテムを左揃えで配置(デフォルト)
flex-end            アイテムを右揃えで配置
center              アイテムを左右中央揃えで配置
space-between       両端のアイテムを余白を空けずに配置し、他の要素は均等に間隔を空けて配置
space-around        両端のアイテムも含めて、均等な間隔を空けて配置
*/
.p_justify_flex-end   { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }
.p_justify_center     { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.p_justify_space-ard  { -ms-flex-pack: distribute; justify-content: space-around; }
.p_justify_space-btw  { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.p_justify_space-even { -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; justify-content: space-evenly; }
/*
align-items         要素の垂直方向の位置を指定するプロパティ
---------------------------------------------
stretch             アイテムを上下の余白を埋めるように配置(デフォルト)
flex-start          アイテムを上揃えで配置
flex-end            アイテムを下揃えで配置
center              アイテムを上下中央揃えで配置
baseline            アイテムをベースラインに合わせて配置
*/
.p_ali_flex-start { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
.p_ali_flex-end   { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }
.p_ali_center     { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.p_ali_baseline   { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }
/*
align-content       複数行の時の垂直方向の位置を指定するプロパティ
---------------------------------------------
stretch             アイテムの行を余白を埋めるように配置
flex-start          アイテムの行を上揃えで配置
flex-end            アイテムの行を下揃えで配置
center              アイテムの行を上下中央揃えで配置
space-between       最上行と最下行のアイテムを余白を空けずに配置し、他のアイテム行は均等に間隔を空けて配置
space-around        最上行と最下行のアイテムを余白を空けずに配置し、他のアイテム行は均等に間隔を空けて配置
*/
.p_alc_flex-start { -ms-flex-line-pack: start; align-content: flex-start; }
.p_alc_flex-end   { -ms-flex-line-pack: end; align-content: flex-end; }
.p_alc_space-ard  { -ms-flex-line-pack: distribute; align-content: space-around; }
.p_alc_space-btw  { -ms-flex-line-pack: justify; align-content: space-between; }
.p_alc_center     { -ms-flex-line-pack: center; align-content: center; }
/*
子要素に使用できるプロパティ utility
---------------------------------------------
order               アイテムの並び順を指定
    .f-item01 {order: 3;}
    .f-item02 {order: 1;}
    .f-item03 {order: 4;}
    .f-item04 {order: 2;}
flex-grow           アイテムの伸び率を指定
    .f-item01 {flex-grow:3;}
    .f-item02 {flex-grow:1;}
    .f-item03 {flex-grow:4;}
    .f-item04 {flex-grow:2;}
flex-shrink         アイテムの縮み率を指定
    .f-item01 {flex-shrink:1;}
    .f-item02 {flex-shrink:2;}
    .f-item03 {flex-shrink:1.5;}
    .f-item04 {flex-shrink:1;}
flex-basis          アイテムのベースの幅を指定
    .f-item01 {flex-basis:50%;}
    .f-item02 {flex-basis:20%;}
    .f-item03 {flex-basis:30%;}
    .f-item04 {flex-basis:40%;}
flex                アイテムの伸び率、縮み率、ベースの幅を一括指定
    .f-item01 {flex: 1 0 20%;}
    .f-item02 {flex: 2 0 30%;}
    .f-item03 {flex: 1 0 50%;}
align-self          アイテムの垂直方向の位置を指定 (project)
    auto            親要素のalign-itemsの値を使用(デフォルト)
    flex-start      アイテムを上揃えで配置
    flex-end        アイテムを下揃えで配置
    center          アイテムを中央揃えで配置
    baselne         アイテムをベースラインに合わせて配置
    stretch         アイテムを上下の余白を埋めるように配置
*/

/*
odd  奇数
even 偶数
*/

/* 奇数が逆 */
.p_flex__Odd_alt:nth-child(odd) {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.p_flex__Odd_alt:nth-child(even) {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column;
flex-direction: column;
}

/*　偶数が逆　*/
.p_flex__Even_alt:nth-child(even) {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.p_flex__Even_alt:nth-child(odd) {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column;
flex-direction: column;
}


/* ============================================ Box Layout FLOAT ============================================ */
/* ルール
↑　　 4%
768px  8%
480px 12%
となるようにする。
*/
/* ================================================== 2 BOX ================================================== */

/*
p_float__2Col_01 ●PC_2--768px_1--480px_1　●Col 2 / 4 / 6 / 8 / 10 /
p_float__2Col_02 ●PC_2--768px_2--480px_1　●Col 2 / 4 / 6 / 8 / 10 /
p_float__2Col_03 ●PC_2--768px_2--480px_2　●Col 2 / 4 / 6 / 8 / 10 / 12 / 14 / 16 / 18 / 20 / 24 /
*/

/* 2BOX
--------------------------------------*/
.p_float__2Col_01 { margin-top: 0; }

.p_float__2Col_01 > div,
.p_float__2Col_01 > li { float: left; width: 48%; margin-top: 4%; }

.p_float__2Col_01 > div:nth-child(2n+1),
.p_float__2Col_01 > li:nth-child(2n+1) { margin-right: 4%; } /* 1番目と3番目の要素に右マージンを付与 */

@media (max-width: 768px) {
.p_float__2Col_01 { margin-top: 8%; }

.p_float__2Col_01 > div,
.p_float__2Col_01 > li { float: none; width: 72%; margin: 4% auto 0; }

.p_float__2Col_01 > div:nth-child(2n+1),
.p_float__2Col_01 > li:nth-child(2n+1) { margin-right: auto; } /* 1番目と3番目の要素の右マージンをリセット */
}

@media (max-width: 480px) {
.p_float__2Col_01 { margin-top: 12%; }

.p_float__2Col_01 > div,
.p_float__2Col_01 > li { width: 100%; }
}

/* 2BOX
--------------------------------------*/
.p_float__2Col_02 { margin-top: 0; }

.p_float__2Col_02 > div,
.p_float__2Col_02 > li { float: left; width: 48%; margin-top: 4%; }
.p_float__2Col_02 > div:nth-child(2n+1),
.p_float__2Col_02 > li:nth-child(2n+1) { margin-right: 4%; } /* 1番目と3番目の要素に右マージンを付与 */

@media (max-width: 768px) {
.p_float__2Col_02 { margin-top: 4%; }  
}

@media (max-width: 480px) {
.p_float__2Col_02 { margin-top: 12%; }

.p_float__2Col_02 > div,
.p_float__2Col_02 > li { float: none; width: 100%; }

.p_float__2Col_02 > div:nth-child(2n+1),
.p_float__2Col_02 > li:nth-child(2n+1) { margin-right: auto; } /* 1番目と3番目の要素の右マージンをリセット */
}

/* 2BOX
--------------------------------------*/
.p_float__2Col_03 { margin-top: 0; }

.p_float__2Col_03 > div,
.p_float__2Col_03 > li { float: left; width: 48%; margin-top: 4%; }

.p_float__2Col_03 > div:nth-child(2n+1),
.p_float__2Col_03 > li:nth-child(2n+1) { margin-right: 4%; } /* 1番目と3番目の要素に右マージンを付与 */

@media (max-width: 768px) {
.p_float__2Col_03 { margin-top: 4%; }
}

@media (max-width: 480px) {
.p_float__2Col_03 { margin-top: 8%; }
}

/* ================================================== 3 BOX ================================================== */

/* IN CASE
p_float__3Col_01		BOX  6 / 12 / 18 /
p_float__3Col_02		BOX  6 / 12 / 18 / 24 /
p_float__3Col_03		BOX  3 /  6 /	 9 / 12 /
*/
/*
p_flex__3Col_01 ●PC_3--768px_2--480px_1 ●Col 6 / 12 / 18 /
p_flex__3Col_02 ●PC_3--768px_2--480px_2 ●Col 6 / 12 / 18 / 24 /
p_flex__3Col_03	●PC_3--768px_1--480px_1 ●Col 3 / 6 / 9 / 12 /
*/

/* 3BOX
--------------------------------------*/
/* library
.p_float__3Col_01
.p_float__3Col_01 > ***:nth-child(3n-1)
width: 33%　→　margin: 0 .5% 4%;
width: 32%　→　margin: 0  2% 4%;
*/
.p_float__3Col_01 { margin-top: 0; }

.p_float__3Col_01 > div,
.p_float__3Col_01 > li { float: left; width: 30%; margin-top: 4%; }

.p_float__3Col_01 > div:nth-child(3n-1),
.p_float__3Col_01 > li:nth-child(3n-1) { margin: 4% 5% 0; } /* 真ん中の要素に左右と下のマージンを付与 */

@media (max-width: 768px) {
/* 真ん中の要素のマージンをリセット */
.p_float__3Col_01 > div:nth-child(3n-1),
.p_float__3Col_01 > li:nth-child(3n-1) { margin: 4% 0 0 0; }

/* 再セット */
.p_float__3Col_01 { margin-top: 4%; }

.p_float__3Col_01 > div,
.p_float__3Col_01 > li { width: 48%; }

.p_float__3Col_01 > div:nth-child(2n+1),
.p_float__3Col_01 > li:nth-child(2n+1) { margin-right: 4%; }
}

@media (max-width: 480px) {
.p_float__3Col_01 { margin-top: 8%; }

.p_float__3Col_01 > div,
.p_float__3Col_01 > li { width: 100%; }

.p_float__3Col_01 > div:nth-child(1n+1),
.p_float__3Col_01 > li:nth-child(1n+1) { margin-top: 4%; }
}

/* 3BOX
--------------------------------------*/
.p_float__3Col_02 { margin-top: 0; }

.p_float__3Col_02 > div,
.p_float__3Col_02 > li { float: left; width: 30%; margin-top: 4%; }

.p_float__3Col_02 > div:nth-child(3n-1),
.p_float__3Col_02 > li:nth-child(3n-1) { margin: 4% 5% 0; }

@media (max-width: 768px) {
/* 真ん中の要素のマージンをリセット */
.p_float__3Col_02 > div:nth-child(3n-1),
.p_float__3Col_02 > li:nth-child(3n-1) { margin: 4% 0 0 0; }

/* 再セット */
.p_float__3Col_02 { margin-top: 4%; }

.p_float__3Col_02 > div,
.p_float__3Col_02 > li { width: 48%; }

.p_float__3Col_02 > div:nth-child(2n+1),
.p_float__3Col_02 > li:nth-child(2n+1) { margin-right: 4%; }
}

@media (max-width: 480px) {
.p_float__3Col_02 { margin-top: 8%; }
}

/* 3BOX
--------------------------------------*/
.p_float__3Col_03 { margin-top: 0; }

.p_float__3Col_03 > div,
.p_float__3Col_03 > li { float: left; width: 30%; margin-top: 4%; }

.p_float__3Col_03 > div:nth-child(3n-1),
.p_float__3Col_03 > li:nth-child(3n-1) { margin: 4% 5% 0;} /* 真ん中の要素に左右と下のマージンを付与 */

@media (max-width: 768px) {
/* 真ん中の要素のマージンをリセット */
.p_float__3Col_03 > div:nth-child(3n-1),
.p_float__3Col_03 > li:nth-child(3n-1) { margin: 4% auto 0; }

/* 再セット */
.p_float__3Col_03 { margin-top: 8%; }

.p_float__3Col_03 > div,
.p_float__3Col_03 > li { float: none; width: 72%; margin: 4% auto 0; }
}

@media (max-width: 480px) {
.p_float__3Col_03 { margin-top: 12%; }

.p_float__3Col_03 > div,
.p_float__3Col_03 > li { width: 100%; }
}

/* ================================================== 4 BOX ================================================== */

/* IN CASE
p_float__4Col_01		BOX 12 /
p_float__4Col_02		BOX  4 /  8 / 12 / 16 / 20 / 24 / 28 /
p_float__4Col_03		BOX  4 /  8 /
p_float__4Col_04		BOX	12 / 24 / 36 /
*/
/*
p_flex__4Col_01	●PC_4--980px_3--768px_2--480px_1	Col 12 /
p_flex__4Col_02	●PC_4--980px_4--768px_2--480px_2    Col  4 /  8 / 12 / 16 / 20 / 24 / 28 /
p_flex__4Col_03	●PC_4--980px_4--768px_2--480px_1    Col  4 /  8 /
p_flex__4Col_04	●PC_4--980px_3--768px_2--480px_2	Col	12 / 24 / 36 /
*/
/* 4BOX
--------------------------------------*/
/* library
.p_float__4Col_01		
width: 24%	  →　margin: 0 1.335% 4%;
width: 23.5%　→	margin: 0 2% 4%;
width: 23%	　→	margin: 0 2.667% 4%;
width: 22%	　→	margin: 0 4% 4%;
*/
.p_float__4Col_01 { margin-top: 0; }

.p_float__4Col_01 > div,
.p_float__4Col_01 > li { float: left; width: 22.6%; margin: 4% 3.2% 0 0; }

.p_float__4Col_01 > div:first-child,
.p_float__4Col_01 > li:first-child { margin-left: 0; }

.p_float__4Col_01 > div:nth-child(4n),
.p_float__4Col_01 > li:nth-child(4n) { margin-right: 0; }

@media (max-width: 980px) {
/* reset */
.p_float__4Col_01 > div:first-child,
.p_float__4Col_01 > li:first-child { margin-left: auto; }

.p_float__4Col_01 > div:nth-child(4n),
.p_float__4Col_01 > li:nth-child(4n) { margin-right: auto; }

.p_float__4Col_01 > div,
.p_float__4Col_01 > li { width: 30%; margin: 4% 0 0 0; }

/* set */
.p_float__4Col_01 > div:nth-child(3n-1),
.p_float__4Col_01 > li:nth-child(3n-1) { margin: 4% 5% 0; } /* 真ん中の要素のマージンをセット */
}

@media (max-width: 768px) {
/* reset */
.p_float__4Col_01 > div:nth-child(3n-1),
.p_float__4Col_01 > li:nth-child(3n-1) { margin: 4% 0 0 0; } /* 真ん中の要素のマージンをリセット */

/* set */
.p_float__4Col_01 { margin-top: 4%; }

.p_float__4Col_01 > div,
.p_float__4Col_01 > li { width: 48%; }

.p_float__4Col_01 > div:nth-child(2n+1),
.p_float__4Col_01 > li:nth-child(2n+1) { margin-right: 4%; }
}

@media (max-width: 480px) {
/* reset */
.p_float__4Col_01 > div:nth-child(2n+1),
.p_float__4Col_01 > li:nth-child(2n+1) { margin-right: auto; }

/* set */
.p_float__4Col_01 { margin-top: 8%; }

.p_float__4Col_01 > div:nth-child(2n+1),
.p_float__4Col_01 > li:nth-child(2n+1),
.p_float__4Col_01 > div:nth-child(3n-1),
.p_float__4Col_01 > li:nth-child(3n-1) { margin-top: 4%; } /* 真ん中（上から2番目）の要素に下マージンを付与 */

.p_float__4Col_01 > div,
.p_float__4Col_01 > li { width: 100%; }
}

/* 4BOX
--------------------------------------*/
.p_float__4Col_02 { margin-top: 0; }

.p_float__4Col_02 > div,
.p_float__4Col_02 > li { float: left; width: 22.6%; margin: 4% 3.2% 0 0; }

.p_float__4Col_02 > div:first-child,
.p_float__4Col_02 > li:first-child { margin-left: 0; }

.p_float__4Col_02 > div:nth-child(4n),
.p_float__4Col_02 > li:nth-child(4n) { margin-right: 0; }

@media (max-width: 768px) {
.p_float__4Col_02 { margin-top: 4%; }

.p_float__4Col_02 > div,
.p_float__4Col_02 > li { width: 48%; margin: 4% 0 0; }

.p_float__4Col_02 > div:nth-child(2n+1),
.p_float__4Col_02 > li:nth-child(2n+1) { margin-right: 4%; }
}

@media (max-width: 480px) {
.p_float__4Col_02 { margin-top: 8%; }
}

/* 4BOX
--------------------------------------*/
.p_float__4Col_03 { margin-top: 0; }

.p_float__4Col_03 > div,
.p_float__4Col_03 > li { float: left; width: 22.6%; margin: 4% 3.2% 0 0; }

.p_float__4Col_03 > div:first-child,
.p_float__4Col_03 > li:first-child { margin-left: 0; }

.p_float__4Col_03 > div:nth-child(4n),
.p_float__4Col_03 > li:nth-child(4n) { margin-right: 0; }

@media (max-width: 768px) {
.p_float__4Col_03 { margin-top: 4%; }

.p_float__4Col_03 > div,
.p_float__4Col_03 > li { width: 48%; margin: 4% 0 0; }

.p_float__4Col_03 > div:nth-child(2n+1),
.p_float__4Col_03 > li:nth-child(2n+1) { margin-right: 4%; }
}

@media (max-width: 480px) {
.p_float__4Col_03 { margin-top: 8%; }

.p_float__4Col_03 > div:nth-child(2n+1),
.p_float__4Col_03 > li:nth-child(2n+1),
.p_float__4Col_03 > div:nth-child(3n-1),
.p_float__4Col_03 > li:nth-child(3n-1) { margin-top: 4%; } /* 真ん中（上から2番目）の要素に下マージンを付与 */

.p_float__4Col_03 > div,
.p_float__4Col_03 > li { width: 100%; }
}

/* 4BOX
--------------------------------------*/
.p_float__4Col_04 { margin-top: 0; }

.p_float__4Col_04 > div,
.p_float__4Col_04 > li { float: left; width: 22.6%; margin: 4% 3.2% 0 0; }

.p_float__4Col_04 > div:first-child,
.p_float__4Col_04 > li:first-child { margin-left: 0; }

.p_float__4Col_04 > div:nth-child(4n),
.p_float__4Col_04 > li:nth-child(4n) { margin-right: 0; }

@media (max-width: 980px) {
/* reset */
.p_float__4Col_04 > div:first-child,
.p_float__4Col_04 > li:first-child { margin-left: auto; }

.p_float__4Col_04 > div:nth-child(4n),
.p_float__4Col_04 > li:nth-child(4n) { margin-right: auto; }

.p_float__4Col_04 > div,
.p_float__4Col_04 > li { width: 30%; margin: 4% 0 0 0; }

/* set */
.p_float__4Col_04 > div:nth-child(3n-1),
.p_float__4Col_04 > li:nth-child(3n-1) { margin: 4% 5% 0; } /* 真ん中の要素のマージンをセット */
}

@media (max-width: 768px) {
/* reset */
.p_float__4Col_04 > div:nth-child(3n-1),
.p_float__4Col_04 > li:nth-child(3n-1) { margin: 4% 0 0 0; } /* 真ん中の要素のマージンをリセット */

/* set */
.p_float__4Col_04 { margin-top: 4%; }

.p_float__4Col_04 > div,
.p_float__4Col_04 > li { width: 48%; }

.p_float__4Col_04 > div:nth-child(2n+1),
.p_float__4Col_04 > li:nth-child(2n+1) { margin-right: 4%; }
}

@media (max-width: 480px) {
.p_float__4Col_04 { margin-top: 8%; }
}


/* ================================================== 5 BOX ================================================== */

/* IN CASE
p_float__5Col_01			BOX  5 /
p_float__5Col_02			BOX 10 / 20 /
p_float__5Col_03			BOX 10 /
p_float__5Col_04			BOX 15 /
p_float__5Col_05		    BOX  5 /							※flexを使った方が良い
p_float__5Col_06			BOX 15 / 30 /
*/
/*
p_flex__5Col_01	●PC_5--768px_5--480px_5   Col  5 /
p_flex__5Col_02	●PC_5--768px_2--480px_2   Col 10 / 20 /
p_flex__5Col_03	●PC_5--768px_2--480px_1   Col 10 /
p_flex__5Col_04	●PC_5--768px_3--480px_1   Col 15 /
p_flex__5Col_05	●PC_5--768px_3--480px_1   Col  5 /
p_flex__5Col_06	●PC_5--768px_3--480px_3   Col 15 / 30 /
*/
/* 5BOX
--------------------------------------*/
.p_float__5Col_01 { margin-top: 0; }

.p_float__5Col_01 > div,
.p_float__5Col_01 > li { float: left; width: 20%;	margin-top: 4%; }

@media (max-width: 768px) {
.p_float__5Col_01 { margin-top: 4%; }
}

@media (max-width: 480px) {
.p_float__5Col_01 { margin-top: 8%; }
}

/* 5BOX
--------------------------------------*/
.p_float__5Col_02 { margin-top: 0; }

.p_float__5Col_02 > div,
.p_float__5Col_02 > li { float: left; width: 19%; margin: 4% 1.25% 0 0; }

.p_float__5Col_02 > div:nth-child(5n),
.p_float__5Col_02 > li:nth-child(5n) { margin-right: 0; }

@media (max-width: 768px) {
.p_float__5Col_02 { margin-top: 4%; }

.p_float__5Col_02 > div,
.p_float__5Col_02 > li { width: 48%; margin: 4% 0 0 0; }

.p_float__5Col_02 > div:nth-child(2n+1),
.p_float__5Col_02 > li:nth-child(2n+1) { margin-right: 4%; }
}

@media (max-width: 480px) {
.p_float__5Col_02 { margin-top: 8%; }
}

/* 5BOX
--------------------------------------*/
.p_float__5Col_03 { margin-top: 0; }

.p_float__5Col_03 > div,
.p_float__5Col_03 > li { float: left; width: 19%;	margin: 4% 1.25% 0 0; }

.p_float__5Col_03 > div:nth-child(5n),
.p_float__5Col_03 > li:nth-child(5n) { margin-right: 0; }

@media (max-width: 768px) {
.p_float__5Col_03 { margin-top: 4%; }

.p_float__5Col_03 > div,
.p_float__5Col_03 > li { width: 48%; margin: 4% 0 0 0; }

.p_float__5Col_03 > div:nth-child(2n+1),
.p_float__5Col_03 > li:nth-child(2n+1) { margin-right: 4%; }
}

@media (max-width: 480px) {
.p_float__5Col_03 { margin-top: 8%; }

.p_float__5Col_03 > div,
.p_float__5Col_03 > li { width: 100%;	margin: 4% 0 0 0; }

.p_float__5Col_03 > div:nth-child(2n+1),
.p_float__5Col_03 > li:nth-child(2n+1) { margin-right: auto; }
}

/* 5BOX
--------------------------------------*/
.p_float__5Col_04 { margin-top: 0; }

.p_float__5Col_04 > div,
.p_float__5Col_04 > li { float: left; width: 19%; margin: 4% 1.25% 0 0; }

.p_float__5Col_04 > div:nth-child(5n),
.p_float__5Col_04 > li:nth-child(5n) { margin-right: 0; }

@media (max-width: 768px) {
.p_float__5Col_04 { margin-top: 4%; }

.p_float__5Col_04 > div,
.p_float__5Col_04 > li { width: 30%; margin: 4% 0 0 0; }

.p_float__5Col_04 > div:nth-child(3n-1),
.p_float__5Col_04 > li:nth-child(3n-1) { margin: 4% 5% 0; } /* 真ん中の要素のマージンをセット */
}

@media (max-width: 480px) {
.p_float__5Col_04 { margin-top: 8%; }

.p_float__5Col_04 > div:nth-child(3n-1),
.p_float__5Col_04 > li:nth-child(3n-1) { margin: 4% 0 0; } /* 真ん中の要素のマージンをリセット */

.p_float__5Col_04 > div,
.p_float__5Col_04 > li { width: 100%; margin: 4% 0 0 0; }
}

/* 5BOX
--------------------------------------*/
.p_float__5Col_05 { margin-top: 0; text-align: center; }

.p_float__5Col_05 > div,
.p_float__5Col_05 > li { display: inline-block;  width: 17%; margin-top: 4%; }

.p_float__5Col_05 > div:first-child,
.p_float__5Col_05 > li:first-child { margin: 4% 1% 0 0; }

.p_float__5Col_05 > div:nth-child(n+2):nth-child(-n+4),
.p_float__5Col_05 > li:nth-child(n+2):nth-child(-n+4) { margin: 4% 1% 0; }

.p_float__5Col_05 > div:last-child,
.p_float__5Col_05 > li:last-child { margin: 4% 0 0 1%; }

@media (max-width: 768px) {
.p_float__5Col_05 { margin-top: 4%; }

.p_float__5Col_05 > div,
.p_float__5Col_05 > li { width: 30%; margin: 4% 0 0 0; }

/* 真ん中の要素のマージンをセット */
.p_float__5Col_05 > div:nth-child(4),
.p_float__5Col_05 > li:nth-child(4),
.p_float__5Col_05 > div:nth-child(5),
.p_float__5Col_05 > li:nth-child(5) { width: 48%; margin: 0 1% 0; text-align: center; }
}
@media (max-width: 480px) {
.p_float__5Col_05 { margin-top: 8%; }

.p_float__5Col_05 > div:nth-child(4),
.p_float__5Col_05 > li:nth-child(4),
.p_float__5Col_05 > div:nth-child(5),
.p_float__5Col_05 > li:nth-child(5) { margin: 0; }

.p_float__5Col_05 > div:first-child,
.p_float__5Col_05 > li:first-child { margin: 4% 0 0 0; }

.p_float__5Col_05 > div:nth-child(n+2):nth-child(-n+4),
.p_float__5Col_05 > li:nth-child(n+2):nth-child(-n+4) { margin: 4% 0 0; }

.p_float__5Col_05 > div:last-child,
.p_float__5Col_05 > li:last-child { margin: 4% 0 0 0; }

.p_float__5Col_05 > div,
.p_float__5Col_05 > li { width: 100%;	margin: 4% 0 0 0; }
}

/* 5BOX
--------------------------------------*/
.p_float__5Col_06 { margin-top: 0%; }

.p_float__5Col_06 > div,
.p_float__5Col_06 > li { float: left; width: 19%; margin: 4% 1.25% 0 0; }

.p_float__5Col_06 > div:nth-child(5n),
.p_float__5Col_06 > li:nth-child(5n) { margin-right: 0; }

@media (max-width: 768px) {
.p_float__5Col_06 { margin-top: 4%; }

.p_float__5Col_06 > div,
.p_float__5Col_06 > li { width: 30%; margin: 4% 0 0 0; }

.p_float__5Col_06 > div:nth-child(3n-1),
.p_float__5Col_06 > li:nth-child(3n-1) { margin: 4% 5% 0; } /* 真ん中の要素のマージンをセット */
}

@media (max-width: 480px) {
.p_float__5Col_06 { margin-top: 8%; }
}

/* ================================================== 6 BOX ================================================== */

/* IN CASE
p_float__6Col_01		BOX  6 /
p_float__6Col_02		BOX  6 / 12 / 24 /
p_float__6Col_03		BOX  6 / 12 / 24 /
*/
/*
p_flex__6Col_01	●PC_6-----------768px_6--480px_6   Col  6 /
p_flex__6Col_02	●PC_6-----------768px_3--480px_3   Col  6 / 12 / 24 /
p_flex__6Col_03	●PC_6--980px_4--768px_3--480px_1   Col  6 / 12 / 24 /
*/
/* 6BOX
--------------------------------------*/
.p_float__6Col_01 { margin-top:0; }

.p_float__6Col_01 > div, 
.p_float__6Col_01 > li { float:left; width:16.666%; margin:4% 0 0 0; }

.p_float__6Col_01 > div:nth-child(6n), 
.p_float__6Col_01 > li:nth-child(6n) { margin-right:0; }

@media (max-width:768px) {
.p_float__6Col_01 { margin-top:4%; }
}

@media (max-width:480px) {
.p_float__6Col_01 { margin-top:8%; }
}

/* 6BOX
--------------------------------------*/
.p_float__6Col_02 { margin-top: 0; }

.p_float__6Col_02 > div,
.p_float__6Col_02 > li { float: left; width: 16%;	margin: 4% .8% 0 0; }

.p_float__6Col_02 > div:nth-child(6n),
.p_float__6Col_02 > li:nth-child(6n) { margin-right: 0; }

@media (max-width: 768px) {
/* reset */
.p_float__6Col_02 > div:nth-child(6n),
.p_float__6Col_02 > li:nth-child(6n) { margin-right: auto; }

/* set */
.p_float__6Col_02 { margin-top: 4%; }

.p_float__6Col_02 > div,
.p_float__6Col_02 > li { width: 30%; margin: 4% 0 0 0; }

.p_float__6Col_02 > div:nth-child(3n-1),
.p_float__6Col_02 > li:nth-child(3n-1) { margin: 4% 5% 0; } /* 真ん中の要素のマージンをセット */
}

@media (max-width: 480px) {
.p_float__6Col_02 { margin-top: 8%; }
}

/* 6BOX
--------------------------------------*/
.p_float__6Col_03 { margin-top: 0; }

.p_float__6Col_03 > div,
.p_float__6Col_03 > li { float: left; width: 16%; margin: 4% .8% 0 0; }

.p_float__6Col_03 > div:nth-child(6n),
.p_float__6Col_03 > li:nth-child(6n) { margin-right: 0; }

@media (max-width: 980px) {
/* reset */
.p_float__6Col_03 > div:nth-child(6n),
.p_float__6Col_03 > li:nth-child(6n) { margin-right: 3.2%; }

/* set */
.p_float__6Col_03 > div,
.p_float__6Col_03 > li { float: left; width: 22.6%; margin: 4% 3.2% 0 0; }

.p_float__6Col_03 > div:first-child,
.p_float__6Col_03 > li:first-child { margin-left: 0; }

.p_float__6Col_03 > div:nth-child(4n),
.p_float__6Col_03 > li:nth-child(4n) { margin-right: 0; }
}

@media (max-width: 768px) {
/* reset */
.p_float__6Col_03 > div:nth-child(6n),
.p_float__6Col_03 > li:nth-child(6n) { margin-right: auto; }

/* set */
.p_float__6Col_03 { margin-top: 4%; }

.p_float__6Col_03 > div,
.p_float__6Col_03 > li { width: 30%; margin: 4% 0 0 0; }

.p_float__6Col_03 > div:nth-child(3n-1),
.p_float__6Col_03 > li:nth-child(3n-1) { margin: 4% 5% 0; } /* 真ん中の要素のマージンをセット */
}

@media (max-width: 480px) {
.p_float__6Col_03 { margin-top: 8%; }

.p_float__6Col_03 > div:nth-child(3n-1),
.p_float__6Col_03 > li:nth-child(3n-1) { margin: 4% 0 0 0; }

.p_float__6Col_03 > div,
.p_float__6Col_03 > li { width: 48%; margin: 4% 0 0 0; }

.p_float__6Col_03 > div:nth-child(2n+1),
.p_float__6Col_03 > li:nth-child(2n+1) { margin-right: 4%; }
}


/* ============================================ Box Layout FLEX ============================================ */

/* 2Colmun
--------------------------------------*/

/*
p_flex__2Col_01 ●PC_2--768px_1--480px_1　●Col 2 / 4 / 6 / 8 / 10 /
p_flex__2Col_02	●PC_2--768px_2--480px_1　●Col 2 / 4 / 6 / 8 / 10 /
p_flex__2Col_03	●PC_2--768px_2--480px_2　●Col 2 / 4 / 6 / 8 / 10 / 12 / 14 / 16 / 18 / 20 / 24 /
*/

/* common */
ul.p_flex__2Col_01, 
.p_flex__2Col_01 > ul, 
div.p_flex__2Col_01, 
.p_flex___2Col_01 > div, 
ul.p_flex__2Col_02, 
.p_flex__2Col_02 > ul, 
div.p_flex__2Col_02, 
.p_flex___2Col_02 > div, 
ul.p_flex__2Col_03, 
.p_flex__2Col_03 > ul, 
div.p_flex__2Col_03, 
.p_flex___2Col_03 > div { width:100%;  display:-ms-flexbox;  display:-webkit-box;  display:flex;  -ms-flex-wrap:-ms-wrap;  flex-wrap:-ms-wrap;  flex-wrap:wrap;  -webkit-box-pack:justify;  -ms-flex-pack:justify;  justify-content:space-between;  -webkit-box-orient:unset;  -webkit-box-direction:unset;  -ms-flex-direction:unset;  flex-direction:unset; }

/* 1 */
.p_flex__2Col_01,
.p_flex___2Col_01 { margin-top: 0; }

ul.p_flex__2Col_01 > li,
.p_flex__2Col_01 > ul > li,
div.p_flex__2Col_01 > div,
.p_flex___2Col_01 > div > div { width: 48%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__2Col_01,
.p_flex___2Col_01 { margin-top: 4%; }

ul.p_flex__2Col_01 > li,
.p_flex__2Col_01 > ul > li,
div.p_flex__2Col_01 > div,
.p_flex___2Col_01 > div > div { width: 72%; margin: 4% auto 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
}

@media (max-width: 480px) {
.p_flex__2Col_01,
.p_flex___2Col_01 { margin-top: 8%; }

ul.p_flex__2Col_01 > li,
.p_flex__2Col_01 > ul > li,
div.p_flex__2Col_01 > div,
.p_flex___2Col_01 > div > div { width: 100%; }
}

/* 2 */
.p_flex__2Col_02, 
.p_flex___2Col_02 { margin-top:0; }

ul.p_flex__2Col_02 > li, 
.p_flex__2Col_02 > ul > li, 
div.p_flex__2Col_02 > div, 
.p_flex___2Col_02 > div > div{ width:48%;  margin-top:4%; }

@media (max-width:768px){
.p_flex__2Col_02,.p_flex___2Col_02 { margin-top:4%;}
}
@media (max-width:480px){
.p_flex__2Col_02,
.p_flex___2Col_02 { margin-top:8%; }

ul.p_flex__2Col_02 > li, 
.p_flex__2Col_02 > ul > li, 
div.p_flex__2Col_02 > div, 
.p_flex___2Col_02 > div > div { width:100%; margin:4% auto 0; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; }
}

/* 3 */
ul.p_flex__2Col_03 > li,
.p_flex__2Col_03 > ul > li,
div.p_flex__2Col_03 > div,
.p_flex___2Col_03 > div > div { width: 48%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__2Col_03,
.p_flex___2Col_03 { margin-top: 4%; }
}

@media (max-width: 480px) {
.p_flex__2Col_03,
.p_flex___2Col_03 { margin-top: 8%; }
}

/* 3Colmun
--------------------------------------*/

/*
p_flex__3Col_01 ●PC_3--768px_2--480px_1 ●Col 6 / 12 / 18 /
p_flex__3Col_02 ●PC_3--768px_2--480px_2 ●Col 6 / 12 / 18 / 24 /
p_flex__3Col_03	●PC_3--768px_1--480px_1 ●Col 3 / 6 / 9 / 12 /
*/

/* common */
ul.p_flex__3Col_01,
.p_flex__3Col_01 > ul,
div.p_flex__3Col_01,
.p_flex___3Col_01 > div,
ul.p_flex__3Col_02,
.p_flex__3Col_02 > ul,
div.p_flex__3Col_02,
.p_flex___3Col_02 > div,
ul.p_flex__3Col_03,
.p_flex__3Col_03 > ul,
div.p_flex__3Col_03,
.p_flex___3Col_03 > div { width: 100%; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-wrap: -ms-wrap; flex-wrap: -ms-wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: unset; -webkit-box-direction: unset; -ms-flex-direction: unset; flex-direction: unset; }

/* 1 */
.p_flex__3Col_01,
.p_flex___3Col_01 { margin-top: 0; }

ul.p_flex__3Col_01 > li,
.p_flex__3Col_01 > ul > li,
div.p_flex__3Col_01 > div,
.p_flex___3Col_01 > div > div { width: 30%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__3Col_01,
.p_flex___3Col_01 { margin-top: 4%; }

ul.p_flex__3Col_01 > li,
.p_flex__3Col_01 > ul > li,
div.p_flex__3Col_01 > div,
.p_flex___3Col_01 > div > div { width: 48%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
}

@media (max-width: 480px) {
.p_flex__3Col_01,
.p_flex___3Col_01 { margin-top: 8%; }

ul.p_flex__3Col_01 > li,
.p_flex__3Col_01 > ul > li,
div.p_flex__3Col_01 > div,
.p_flex___3Col_01 > div > div { width: 100%; }
}

/* 2 */
.p_flex__3Col_02,
.p_flex___3Col_02 { margin-top: 0; }

ul.p_flex__3Col_02 > li,
.p_flex__3Col_02 > ul > li,
div.p_flex__3Col_02 > div,
.p_flex___3Col_02 > div > div { width: 30%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__3Col_02,
.p_flex___3Col_02 { margin-top: 4%; }

ul.p_flex__3Col_02 > li,
.p_flex__3Col_02 > ul > li,
div.p_flex__3Col_02 > div,
.p_flex___3Col_02 > div > div { width: 48%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
}

@media (max-width: 480px) {
.p_flex__3Col_02,
.p_flex___3Col_02 { margin-top: 8%; }
}

/* 3 */
.p_flex__3Col_03,
.p_flex___3Col_03 { margin-top: 0; }

ul.p_flex__3Col_03 > li,
.p_flex__3Col_03 > ul > li,
div.p_flex__3Col_03 > div,
.p_flex___3Col_03 > div > div { width: 30%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__3Col_03,
.p_flex___3Col_03 { margin-top: 4%; }

ul.p_flex__3Col_03 > li,
.p_flex__3Col_03 > ul > li,
div.p_flex__3Col_03 > div,
.p_flex___3Col_03 > div > div { width: 72%; margin: 4% auto 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
}

@media (max-width: 480px) {
.p_flex__3Col_03,
.p_flex___3Col_03 { margin-top: 8%; }

ul.p_flex__3Col_03 > li,
.p_flex__3Col_03 > ul > li,
div.p_flex__3Col_03 > div,
.p_flex___3Col_03 > div > div { width: 100%; }
}

/* 4Colmun
--------------------------------------*/

/*
p_flex__4Col_01	●PC_4--980px_3--768px_2--480px_1	Col 12 /
p_flex__4Col_02	●PC_4--980px_4--768px_2--480px_2    Col  4 /  8 / 12 / 16 / 20 / 24 / 28 /
p_flex__4Col_03	●PC_4--980px_4--768px_2--480px_1    Col  4 /  8 /
p_flex__4Col_04	●PC_4--980px_3--768px_2--480px_2	Col	12 / 24 / 36 /
*/

/* common */
ul.p_flex__4Col_01,
.p_flex__4Col_01 > ul,
div.p_flex__4Col_01,
.p_flex___4Col_01 > div,
ul.p_flex__4Col_02,
.p_flex__4Col_02 > ul,
div.p_flex__4Col_02,
.p_flex___4Col_02 > div,
ul.p_flex__4Col_03,
.p_flex__4Col_03 > ul,
div.p_flex__4Col_03,
.p_flex___4Col_03 > div,
ul.p_flex__4Col_04,
.p_flex__4Col_04 > ul,
div.p_flex__4Col_04,
.p_flex___4Col_04> div { width:100%; display:-ms-flexbox; display:-webkit-box; display:flex; -ms-flex-wrap:-ms-wrap; flex-wrap:-ms-wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -webkit-box-orient:unset; -webkit-box-direction:unset; -ms-flex-direction:unset; flex-direction:unset }

/* 1 */
.p_flex__4Col_01,
.p_flex___4Col_01 { margin-top:0 }

ul.p_flex__4Col_01 > li,
.p_flex__4Col_01 > ul > li,
div.p_flex__4Col_01 > div,
.p_flex___4Col_01 > div > div { width:24%; margin-top:4% }

@media (max-width: 980px) {
ul.p_flex__4Col_01 > li,
.p_flex__4Col_01 > ul > li,
div.p_flex__4Col_01 > div,
.p_flex___4Col_01 > div > div { width: 30%; }
}

@media (max-width: 768px) {
.p_flex__4Col_01,
.p_flex___4Col_01 { margin-top: 4%; }

ul.p_flex__4Col_01 > li,
.p_flex__4Col_01 > ul > li,
div.p_flex__4Col_01 > div,
.p_flex___4Col_01 > div > div { width: 48%; }
}

@media (max-width: 480px) {
.p_flex__4Col_01,
.p_flex___4Col_01 { margin-top:8% }

ul.p_flex__4Col_01 > li,
.p_flex__4Col_01 >ul > li,
div.p_flex__4Col_01 > div,
.p_flex___4Col_01 > div > div { width:100%; margin:4% auto 0; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column }
}

/* 2 */
.p_flex__4Col_02,
.p_flex___4Col_02 { margin-top: 0; }

ul.p_flex__4Col_02 > li,
.p_flex__4Col_02 > ul > li,
div.p_flex__4Col_02 > div,
.p_flex___4Col_02 > div > div { width: 24%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__4Col_02,
.p_flex___4Col_02 { margin-top: 4%; }

ul.p_flex__4Col_02 > li,
.p_flex__4Col_02 > ul > li,
div.p_flex__4Col_02 > div,
.p_flex___4Col_02 > div > div { width: 48%; }
}

@media (max-width: 480px) {
.p_flex__4Col_02,
.p_flex___4Col_02 { margin-top: 8%; }
}

/* 3 */
.p_flex__4Col_03,
.p_flex___4Col_03 { margin-top: 0; }

ul.p_flex__4Col_03 > li,
.p_flex__4Col_03 > ul > li,
div.p_flex__4Col_03 > div,
.p_flex___4Col_03 > div > div { width: 24%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__4Col_03,
.p_flex___4Col_03 { margin-top: 4%; }

ul.p_flex__4Col_03 > li,
.p_flex__4Col_03 > ul > li,
div.p_flex__4Col_03 > div,
.p_flex___4Col_03 > div > div { width: 48%; }
}

@media (max-width: 480px) {
.p_flex__4Col_03,
.p_flex___4Col_03 { margin-top: 8%; }

ul.p_flex__4Col_03 > li,
.p_flex__4Col_03 > ul > li,
div.p_flex__4Col_03 > div,
.p_flex___4Col_03 > div > div { width: 100%; margin: 4% auto 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
}

/* 4 */
.p_flex__4Col_04,
.p_flex___4Col_04{ margin-top: 0; }

ul.p_flex__4Col_04 > li,
.p_flex__4Col_04 > ul > li,
div.p_flex__4Col_04 > div,
.p_flex___4Col_04> div > div { width: 24%; margin-top: 4%; }

@media (max-width: 980px) {
ul.p_flex__4Col_04 > li,
.p_flex__4Col_04 > ul > li,
div.p_flex__4Col_04 > div,
.p_flex___4Col_04> div > div { width: 30%; }
}

@media (max-width: 768px) {
.p_flex__4Col_04,
.p_flex___4Col_04{ margin-top: 4%; }

ul.p_flex__4Col_04 > li,
.p_flex__4Col_04 > ul > li,
div.p_flex__4Col_04 > div,
.p_flex___4Col_04> div > div { width: 48%; }
}

@media (max-width: 480px) {
.p_flex__4Col_04,
.p_flex___4Col_04 { margin-top: 8%; }
}

/* 5Colmun
--------------------------------------*/

/*
p_flex__5Col_01	●PC_5--768px_5--480px_5   Col  5 /
p_flex__5Col_02	●PC_5--768px_2--480px_2   Col 10 / 20 /
p_flex__5Col_03	●PC_5--768px_2--480px_1   Col 10 /
p_flex__5Col_04	●PC_5--768px_3--480px_1   Col 15 /
p_flex__5Col_05	●PC_5--768px_3--480px_1   Col  5 /
p_flex__5Col_06	●PC_5--768px_3--480px_3   Col 15 / 30 /
*/

/* common */
ul.p_flex__5Col_01,
.p_flex__5Col_01 > ul,
div.p_flex__5Col_01,
.p_flex___5Col_01 > div,
ul.p_flex__5Col_02,
.p_flex__5Col_02 > ul,
div.p_flex__5Col_02,
.p_flex___5Col_02 > div,
ul.p_flex__5Col_03,
.p_flex__5Col_03 > ul,
div.p_flex__5Col_03,
.p_flex___5Col_03 > div,
ul.p_flex__5Col_04,
.p_flex__5Col_04 > ul,
div.p_flex__5Col_04,
.p_flex___5Col_04 > div,
ul.p_flex__5Col_05,
.p_flex__5Col_05 > ul,
div.p_flex__5Col_05,
.p_flex___5Col_05 > div,
ul.p_flex__5Col_06,
.p_flex__5Col_06 > ul,
div.p_flex__5Col_06,
.p_flex___5Col_06 > div { width:100%; display:-ms-flexbox; display:-webkit-box; display:flex; -ms-flex-wrap:-ms-wrap; flex-wrap:-ms-wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -webkit-box-orient:unset; -webkit-box-direction:unset; -ms-flex-direction:unset; flex-direction:unset }


/* 1 */
.p_flex__5Col_01,
.p_flex___5Col_01 { margin-top: 0; }

ul.p_flex__5Col_01 > li,
.p_flex__5Col_01 > ul > li,
div.p_flex__5Col_01 > div,
.p_flex___5Col_01 > div > div { width: 20%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__5Col_01,
.p_flex___5Col_01 { margin-top: 4%; }
}

@media (max-width: 480px) {
.p_flex__5Col_01,
.p_flex___5Col_01 { margin-top: 8%; }
}

/* 2 */
.p_flex__5Col_02,
.p_flex___5Col_02 { margin-top: 0; }

ul.p_flex__5Col_02 > li,
.p_flex__5Col_02 > ul > li,
div.p_flex__5Col_02 > div,
.p_flex___5Col_02> div > div { width: 18%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__5Col_02,
.p_flex___5Col_02{ margin-top: 4%; }

ul.p_flex__5Col_02 > li,
.p_flex__5Col_02 > ul > li,
div.p_flex__5Col_02 > div,
.p_flex___5Col_02> div > div { width: 48%; }
}

@media (max-width: 480px) {
.p_flex__5Col_02,
.p_flex___5Col_02{ margin-top: 8%; }
}

/* 3 */
.p_flex__5Col_03,
.p_flex___5Col_03 { margin-top: 0; }

ul.p_flex__5Col_03 > li,
.p_flex__5Col_03 > ul > li,
div.p_flex__5Col_03 > div,
.p_flex___5Col_03 > div > div { width: 18%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__5Col_03,
.p_flex___5Col_03 { margin-top: 4%; }

ul.p_flex__5Col_03 > li,
.p_flex__5Col_03 > ul > li,
div.p_flex__5Col_03 > div,
.p_flex___5Col_03 > div > div { width: 48%; }
}

@media (max-width: 480px) {
.p_flex__5Col_03,
.p_flex___5Col_03 { margin-top: 8%; }

ul.p_flex__5Col_03 > li,
.p_flex__5Col_03 > ul > li,
div.p_flex__5Col_03 > div,
.p_flex___5Col_03 > div > div { width: 100%; margin: 4% auto 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
}

/* 4 */
.p_flex__5Col_04,
.p_flex___5Col_04 { margin-top: 0; }

ul.p_flex__5Col_04 > li,
.p_flex__5Col_04 > ul > li,
div.p_flex__5Col_04 > div,
.p_flex___5Col_04 > div > div { width: 18%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__5Col_04,
.p_flex___5Col_04 { margin-top: 4%; }

ul.p_flex__5Col_04 > li,
.p_flex__5Col_04 > ul > li,
div.p_flex__5Col_04 > div,
.p_flex___5Col_04 > div > div { width: 30%; }
}

@media (max-width: 480px) {
.p_flex__5Col_04,
.p_flex___5Col_04 { margin-top: 8%; }

ul.p_flex__5Col_04 > li,
.p_flex__5Col_04 > ul > li,
div.p_flex__5Col_04 > div,
.p_flex___5Col_04 > div > div { width: 100%; margin: 4% auto 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
}

/* 5 */
.p_flex__5Col_05,
.p_flex___5Col_05 { margin-top: 0; }

ul.p_flex__5Col_05 > li,
.p_flex__5Col_05 > ul > li,
div.p_flex__5Col_05 > div,
.p_flex___5Col_05 > div > div { width: 18%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__5Col_05,
.p_flex___5Col_05 { margin-top: 4%; }

ul.p_flex__5Col_05,
.p_flex__5Col_05 > ul,
div.p_flex__5Col_05,
.p_flex___5Col_05 > div { -ms-flex-pack:distribute; justify-content:space-around; }

ul.p_flex__5Col_05 > li,
.p_flex__5Col_05 > ul > li,
div.p_flex__5Col_05 > div,
.p_flex___5Col_05 > div > div { width: 30%; }
}

@media (max-width: 480px) {
.p_flex__5Col_05,
.p_flex___5Col_05 { margin-top: 8%; }

ul.p_flex__5Col_05 > li,
.p_flex__5Col_05 > ul > li,
div.p_flex__5Col_05 > div,
.p_flex___5Col_05 > div > div { width: 100%; margin: 4% auto 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
}

/* 6 */
.p_flex__5Col_06 { margin-top: 0; }

ul.p_flex__5Col_06 > li,
.p_flex__5Col_06 > ul > li,
div.p_flex__5Col_06 > div,
.p_flex___5Col_06 > div > div { width: 18%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__5Col_06 { margin-top: 4%; }

ul.p_flex__5Col_06 > li,
.p_flex__5Col_06 > ul > li,
div.p_flex__5Col_06 > div,
.p_flex___5Col_06 > div > div { width: 30%; }
}

@media (max-width: 480px) {
.p_flex__5Col_06 { margin-top: 8%; }
}

/* 6Colmun
--------------------------------------*/

/*
p_flex__6Col_01	●PC_6-----------768px_6--480px_6   Col  6 /
p_flex__6Col_02	●PC_6-----------768px_3--480px_3   Col  6 / 12 / 24 /
p_flex__6Col_03	●PC_6--980px_4--768px_3--480px_1   Col  6 / 12 / 24 /
*/

/* common */
ul.p_flex__6Col_01,
.p_flex__6Col_01 > ul,
div.p_flex__6Col_01,
.p_flex___6Col_01 > div,
ul.p_flex__6Col_02,
.p_flex__6Col_02 > ul,
div.p_flex__6Col_02,
.p_flex___6Col_02 > div,
ul.p_flex__6Col_03,
.p_flex__6Col_03 > ul,
div.p_flex__6Col_03,
.p_flex___6Col_03 > div { width: 100%; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-wrap: -ms-wrap; flex-wrap: -ms-wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: unset; -webkit-box-direction: unset; -ms-flex-direction: unset; flex-direction: unset; }

/* 1 */
.p_flex__6Col_01,
.p_flex___6Col_01 { margin-top: 0; }

ul.p_flex__6Col_01 > li,
.p_flex__6Col_01 > ul > li,
div.p_flex__6Col_01 > div,
.p_flex___6Col_01 > div > div { width: 16.6669%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__6Col_01,
.p_flex___6Col_01 { margin-top: 4%; }
}

@media (max-width: 480px) {
.p_flex__6Col_01,
.p_flex___6Col_01 { margin-top: 8%; }
}

/* 2 */
.p_flex__6Col_02,
.p_flex___6Col_02 {
margin-top: 0;
}
ul.p_flex__6Col_02 > li,
.p_flex__6Col_02 > ul > li,
div.p_flex__6Col_02 > div,
.p_flex___6Col_02 > div > div { width: 16%; margin-top: 4%; }

@media (max-width: 768px) {
.p_flex__6Col_02,
.p_flex___6Col_02 { margin-top: 4%; }

ul.p_flex__6Col_02 > li,
.p_flex__6Col_02 > ul > li,
div.p_flex__6Col_02 > div,
.p_flex___6Col_02 > div > div { width: 30%; }
}

@media (max-width: 480px) {
.p_flex__6Col_02,
.p_flex___6Col_02 { margin-top: 8%; }
}

/* 3 */
.p_flex__6Col_03,
.p_flex___6Col_03 { margin-top: 0; }

ul.p_flex__6Col_03 > li,
.p_flex__6Col_03 > ul > li,
div.p_flex__6Col_03 > div,
.p_flex___6Col_03 > div > div { width: 16%; margin-top: 4%; }

@media (max-width: 980px) {
ul.p_flex__6Col_03 > li,
.p_flex__6Col_03 > ul > li,
div.p_flex__6Col_03 > div,
.p_flex___6Col_03 > div > div { width: 22.6%; }
}

@media (max-width: 768px) {
.p_flex__6Col_03,
.p_flex___6Col_03 { margin-top: 4%; }

ul.p_flex__6Col_03 > li,
.p_flex__6Col_03 > ul > li,
div.p_flex__6Col_03 > div,
.p_flex___6Col_03 > div > div { width: 30%; }
}

@media (max-width: 480px) {
.p_flex__6Col_03,
.p_flex___6Col_03 { margin-top: 8%; }

ul.p_flex__6Col_03 > li,
.p_flex__6Col_03 > ul > li,
div.p_flex__6Col_03 > div,
.p_flex___6Col_03 > div > div { width: 48%; }
}


/* ========================================== */
/* GOOGLE MAP
/* ========================================== */

.c_gmap {
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
margin-bottom: 40px;
}
.c_gmap iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}


/* ========================================== */
/* BUTTON
/* ========================================== */

/* ========================================== */
/* BANNER
/* ========================================== */

/* ========================================== */
/* WRITING MODE
/* ========================================== */
/*
.v-mode { 
  font-family: 'Yu Mincho', YuMincho, 'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'HGP明朝B', serif;
  -webkit-font-feature-settings: 'pkna';
          font-feature-settings: 'pkna';
  font-size: 17px;
  line-height: 1.9;
  letter-spacing: 0.03em;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
}
.mincho-mode { 
  font-family: 'Yu Mincho', YuMincho, 'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'HGP明朝B', serif;
  -webkit-font-feature-settings: 'pkna';
          font-feature-settings: 'pkna';
  font-size: 17px;
  line-height: 1.9;
  letter-spacing: 0.03em;
}
*/

/* ========================================== */
/* BREADCRUMB
/* ========================================== */

/* ========================================== */
/* SNS
/* ========================================== */

/* ========================================== */
/* ATTENTION
/* ========================================== */
.att {
  margin-bottom: 44px;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
}
.att2 {
  margin-bottom: 44px;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  color: #969696;
}
.att3 img {
  width: 100%;
}
.att4 img {
  width: 100%;
  margin-top: 40px;
}
@media screen and (max-width:512px){
.att2 {
  text-align: left;
}
.att3 {
}
}


/* ========================================== */
/* READ MORE
/* ========================================== */

.more {
  display: block;
  clear: both;
  text-align: right;
}

.more.staff-interview {
  margin: 0 0 108px;
  text-align: center;
}
.more.staff-interview img {
  width: 100%;
}

.more:hover {
  text-decoration: underline;
}

/* ========================================== */
/* EXTERNAL LINK
/* ========================================== */
.extlink1 {
  padding-right: 16px;
  background: url(../img/icon-common-extlink1.png)no-repeat right center;
  background-size: 14px;
  background-position: right 4px;
}
.extlink2 {
  padding-right: 16px;
  background: url(../img/icon-common-extlink2.png)no-repeat right center;
  background-size: 14px;
  background-position: right 4px;
}


/* ========================================== */
/* ページネーション
/* ========================================== */

/* ========================================== */
/* リスト
/* ========================================== */

/* ul */
.u_list_01 li { padding: 10px; }

/* dl */
dl dt { font-weight: 900; padding: 8px 0 12px; }
dl dd { line-height: 2; }

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

/* Font */

.u_gothic_01 { font-family: "游ゴシック体","Yu Gothic",YuGothic,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"sans-serif","Osaka,sans-serif"; }

.u_gothic_02 { font-family:"游ゴシック体","Yu Gothic",YuGothic,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"sans-serif","Osaka,sans-serif"; }

.u_gothic_03 { font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif; }

.u_Mincho_01 { font-family: "游明朝","Yu Mincho",YuMincho, Georgia,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif; }

.u_Mincho_02 { font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; }

.u_mincho_03 { font-family: "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; }

/* よく使う色
--------------------------------------*/
.u_white {color: #fff;}
.u_black {color: #000;}

/* テキストの位置
--------------------------------------*/
.u_text_left {text-align: left; }
.u_text_center{text-align: center; }
.u_text_right{text-align: right; }

/* 背景で見にくい時
--------------------------------------*/
.u_text_shadow { text-shadow: 1px 1px 1px #000; }

/* 文の途中で折り返さない
--------------------------------------*/
.u_ibrow { display: inline-block; }

/* inline要素をblock要素に変えて改行させる
--------------------------------------*/
.u_block { display: block; }

/* 先頭を揃える（Align Head）
--------------------------------------*/
.u_ah span:first-child {
  float: left;
}
.u_ah span:nth-child(2) {
  display: block;
  margin-left: 12px;
  overflow: hidden;
}

/* テキストの位置　※inline要素対応
--------------------------------------*/
.u_tc_01, /* 1 block要素　2 inline要素 3 親要素の内側でセンター配置 */
.u_tc_02  { text-align: center; }
.u_tc_02  { display: block; }
.u_tc_03  { width:100%; text-align:center; }
.u_tr_01,
.u_tr_02  { text-align: right; }
.u_tr_02  { display: block; }
.u_tl_01,
.u_tl_02  { text-align: left; }
.u_tl_02  { display: block; }


/* 画像の上にセンタリング 
--------------------------------------*/
/* 親要素 */
.u_rel {
position: relative;
}
/* 子要素 */
.u_abs_c {
position: absolute;
top: 50%;
left: 50%;
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
margin:0;
padding:0;
}
/* タイトル */
.u_abs_tl_c {
position: absolute;
top: 50%;
left: 50%;
-ms-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
width: 100%;
margin:0;
padding:0;
text-align: center;
}


/* 縦書き
--------------------------------------*/
.u_vertical {
text-align: left;
white-space: nowrap;
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}

/* アンダーライン
--------------------------------------*/
/* text-decoration */
/* 一重の線 */
.u_ul_01 { -webkit-text-decoration: underline solid #000; text-decoration: underline solid #000; }
/* 二重線 */
.u_ul_02 { -webkit-text-decoration: underline double #000; text-decoration: underline double #000; }
/* 点線 */
.u_ul_03 { -webkit-text-decoration: underline dotted #000; text-decoration: underline dotted #000; }
/* 破線 */
.u_ul_04 { -webkit-text-decoration: underline dashed #000; text-decoration: underline dashed #000; }
/* 波状の線 */
.u_ul_05 { -webkit-text-decoration: underline wavy #000; text-decoration: underline wavy #000; }

/* border-bottom */
/* 一重線 */
.u_bb_01 { border-bottom: solid 2px #000; }
/* 二重線 */
.u_bb_02 { border-bottom: double 2px #000; }
/* 破線 */
.u_bb_03 { border-bottom: dashed 2px #000; }
/* 点線 */
.u_bb_04 { border-bottom: dotted 2px #000; }

/* マーカー marker-border */
/* 50%下線にマーカー表示 */
.u_mk_01 { background:-webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), color-stop(0%, #ffff66)); background:-o-linear-gradient(transparent 50%, #ffff66 0%); background:linear-gradient(transparent 50%, #ffff66 0%); }
/* 40%下線にマーカー表示 */
.u_mk_02 { background:-webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(0%, #ffcc99)); background:-o-linear-gradient(transparent 60%, #ffcc99 0%); background:linear-gradient(transparent 60%, #ffcc99 0%); }
/* 30%下線にマーカー表示 */
.u_mk_03 { background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(0%, #ffcccc)); background: -o-linear-gradient(transparent 70%, #ffcccc 0%); background: linear-gradient(transparent 70%, #ffcccc 0%); }
/* 20%下線にマーカー表示 */
.u_mk_04 { background:-webkit-gradient(linear, left top, left bottom, color-stop(80%, transparent), color-stop(0%, #99ccff)); background:-o-linear-gradient(transparent 80%, #99ccff 0%); background:linear-gradient(transparent 80%, #99ccff 0%); }

/* ========================================== */
/* リスト
/* ========================================== */

/*

	--	LIST PARTS	--

.li_●●●●(リストのタイプ)

ul,olに付与する

*/

/* TEXT LIST
--------------------------------------*/
ul.li_text li span:first-child {
  float:left;
}
ul.li_text li span:nth-child(2) {
  display: block;
  margin-left: 12px;
  overflow: hidden;
}
ul.u_listmark li {
  list-style: disc;
  margin-left: 20px;
}

/* ========================================== */
/* utility style
/* ========================================== */

/* line-height */
.u_line-height20 { line-height: 20px; }
.u_line-height40 { line-height: 40px; }

/* circle */
.u_circle { border-radius: 50%; }
.u_circle_frm { border-radius: 50%; overflow: hidden; }

/* position */

.u_left   { float: left; }
.u_right  { float: right; }
.u_center { margin: 0 auto; }
.u_hidden { overflow: hidden; }

/* margin - 要素の外側の余白 */

/* margin 0px を指定するクラス */
.u_m0 { margin: 0 !important; }
/* margin-top0px を指定するクラス */
.u_mt0 { margin-top: 0 !important; }
/* margin-right0px を指定するクラス*/
.u_mr0 { margin-right: 0 !important; }
/* margin-bottom0px を指定するクラス*/
.u_mb0 { margin-bottom: 0 !important; }
/* margin-left0px を指定するクラス*/
.u_ml0 { margin-left: 0 !important; }

.u_m5 { margin: 5px !important; }
.u_mt5 { margin-top: 5px !important; }
.u_mr5 { margin-right: 5px !important; }
.u_mb5 { margin-bottom: 5px !important; }
.u_ml5 { margin-left: 5px !important; }
.u_m10 { margin: 10px !important; }
.u_mt10 { margin-top: 10px !important; }
.u_mr10 { margin-right: 10px !important; }
.u_mb10 { margin-bottom: 10px !important; }
.u_ml10 { margin-left: 10px !important; }
.u_m15 { margin: 15px !important; }
.u_mt15 { margin-top: 15px !important; }
.u_mr15 { margin-right: 15px !important; }
.u_mb15 { margin-bottom: 15px !important; }
.u_ml15 { margin-left: 15px !important; }
.u_m20 { margin: 20px !important; }
.u_mt20 { margin-top: 20px !important; }
.u_mr20 { margin-right: 20px !important; }
.u_mb20 { margin-bottom: 20px !important; }
.u_ml20 { margin-left: 20px !important; }
.u_m25 { margin: 25px !important; }
.u_mt25 { margin-top: 25px !important; }
.u_mr25 { margin-right: 25px !important; }
.u_mb25 { margin-bottom: 25px !important; }
.u_ml25 { margin-left: 25px !important; }
.u_m30 { margin: 30px !important; }
.u_mt30 { margin-top: 30px !important; }
.u_mr30 { margin-right: 30px !important; }
.u_mb30 { margin-bottom: 30px !important; }
.u_ml30 { margin-left: 30px !important; }
.u_m35 { margin: 35px !important; }
.u_mt35 { margin-top: 35px !important; }
.u_mr35 { margin-right: 35px !important; }
.u_mb35 { margin-bottom: 35px !important; }
.u_ml35 { margin-left: 35px !important; }
.u_m40 { margin: 40px !important; }
.u_mt40 { margin-top: 40px !important; }
.u_mr40 { margin-right: 40px !important; }
.u_mb40 { margin-bottom: 40px !important; }
.u_ml40 { margin-left: 40px !important; }
.u_m45 { margin: 45px !important; }
.u_mt45 { margin-top: 45px !important; }
.u_mr45 { margin-right: 45px !important; }
.u_mb45 { margin-bottom: 45px !important; }
.u_ml45 { margin-left: 45px !important; }
.u_m50 { margin: 50px !important; }
.u_mt50 { margin-top: 50px !important; }
.u_mr50 { margin-right: 50px !important; }
.u_mb50 { margin-bottom: 50px !important; }
.u_ml50 { margin-left: 50px !important; }
.u_m55 { margin: 55px !important; }
.u_mt55 { margin-top: 55px !important; }
.u_mr55 { margin-right: 55px !important; }
.u_mb55 { margin-bottom: 55px !important; }
.u_ml55 { margin-left: 55px !important; }
.u_m60 { margin: 60px !important; }
.u_mt60 { margin-top: 60px !important; }
.u_mr60 { margin-right: 60px !important; }
.u_mb60 { margin-bottom: 60px !important; }
.u_ml60 { margin-left: 60px !important; }
.u_m65 { margin: 65px !important; }
.u_mt65 { margin-top: 65px !important; }
.u_mr65 { margin-right: 65px !important; }
.u_mb65 { margin-bottom: 65px !important; }
.u_ml65 { margin-left: 65px !important; }
.u_m70 { margin: 70px !important; }
.u_mt70 { margin-top: 70px !important; }
.u_mr70 { margin-right: 70px !important; }
.u_mb70 { margin-bottom: 70px !important; }
.u_ml70 { margin-left: 70px !important; }
.u_m75 { margin: 75px !important; }
.u_mt75 { margin-top: 75px !important; }
.u_mr75 { margin-right: 75px !important; }
.u_mb75 { margin-bottom: 75px !important; }
.u_ml75 { margin-left: 75px !important; }
.u_m80 { margin: 80px !important; }
.u_mt80 { margin-top: 80px !important; }
.u_mr80 { margin-right: 80px !important; }
.u_mb80 { margin-bottom: 80px !important; }
.u_ml80 { margin-left: 80px !important; }
/* padding - 要素の内側の余白 */
.u_p0 { padding: 0 !important; }
.u_pt0 { padding-top: 0 !important; }
.u_pr0 { padding-right: 0 !important; }
.u_pb0 { padding-bottom: 0 !important; }
.u_pl0 { padding-left: 0 !important; }
.u_p5 { padding: 5px !important; }
.u_pt5 { padding-top: 5px !important; }
.u_pr5 { padding-right: 5px !important; }
.u_pb5 { padding-bottom: 5px !important; }
.u_pl5 { padding-left: 5px !important; }
.u_p10 { padding: 10px !important; }
.u_pt10 { padding-top: 10px !important; }
.u_pr10 { padding-right: 10px !important; }
.u_pb10 { padding-bottom: 10px !important; }
.u_pl10 { padding-left: 10px !important; }
.u_p15 { padding: 15px !important; }
.u_pt15 { padding-top: 15px !important; }
.u_pr15 { padding-right: 15px !important; }
.u_pb15 { padding-bottom: 15px !important; }
.u_pl15 { padding-left: 15px !important; }
.u_p20 { padding: 20px !important; }
.u_pt20 { padding-top: 20px !important; }
.u_pr20 { padding-right: 20px !important; }
.u_pb20 { padding-bottom: 20px !important; }
.u_pl20 { padding-left: 20px !important; }
.u_p25 { padding: 25px !important; }
.u_pt25 { padding-top: 25px !important; }
.u_pr25 { padding-right: 25px !important; }
.u_pb25 { padding-bottom: 25px !important; }
.u_pl25 { padding-left: 25px !important; }
.u_p30 { padding: 30px !important; }
.u_pt30 { padding-top: 30px !important; }
.u_pr30 { padding-right: 30px !important; }
.u_pb30 { padding-bottom: 30px !important; }
.u_pl30 { padding-left: 30px !important; }
.u_p35 { padding: 35px !important; }
.u_pt35 { padding-top: 35px !important; }
.u_pr35 { padding-right: 35px !important; }
.u_pb35 { padding-bottom: 35px !important; }
.u_pl35 { padding-left: 35px !important; }
.u_p40 { padding: 40px !important; }
.u_pt40 { padding-top: 40px !important; }
.u_pr40 { padding-right: 40px !important; }
.u_pb40 { padding-bottom: 40px !important; }
.u_pl40 { padding-left: 40px !important; }
.u_p45 { padding: 45px !important; }
.u_pt45 { padding-top: 45px !important; }
.u_pr45 { padding-right: 45px !important; }
.u_pb45 { padding-bottom: 45px !important; }
.u_pl45 { padding-left: 45px !important; }
.u_p50 { padding: 50px !important; }
.u_pt50 { padding-top: 50px !important; }
.u_pr50 { padding-right: 50px !important; }
.u_pb50 { padding-bottom: 50px !important; }
.u_pl50 { padding-left: 50px !important; }
.u_p55 { padding: 55px !important; }
.u_pt55 { padding-top: 55px !important; }
.u_pr55 { padding-right: 55px !important; }
.u_pb55 { padding-bottom: 55px !important; }
.u_pl55 { padding-left: 55px !important; }
.u_p60 { padding: 60px !important; }
.u_pt60 { padding-top: 60px !important; }
.u_pr60 { padding-right: 60px !important; }
.u_pb60 { padding-bottom: 60px !important; }
.u_pl60 { padding-left: 60px !important; }
.u_p65 { padding: 65px !important; }
.u_pt65 { padding-top: 65px !important; }
.u_pr65 { padding-right: 65px !important; }
.u_pb65 { padding-bottom: 65px !important; }
.u_pl65 { padding-left: 65px !important; }
.u_p70 { padding: 70px !important; }
.u_pt70 { padding-top: 70px !important; }
.u_pr70 { padding-right: 70px !important; }
.u_pb70 { padding-bottom: 70px !important; }
.u_pl70 { padding-left: 70px !important; }
.u_p75 { padding: 75px !important; }
.u_pt75 { padding-top: 75px !important; }
.u_pr75 { padding-right: 75px !important; }
.u_pb75 { padding-bottom: 75px !important; }
.u_pl75 { padding-left: 75px !important; }
.u_p80 { padding: 80px !important; }
.u_pt80 { padding-top: 80px !important; }
.u_pr80 { padding-right: 80px !important; }
.u_pb80 { padding-bottom: 80px !important; }
.u_pl80 { padding-left: 80px !important; }


/* ========================================== */
/* VIEW POINT
/* ========================================== */

/* テキスト用 */

.u_view { display: block; }
@media screen and (max-width:768px){
.u_view { display: none; }
}

/* サイズを伴うオブジェクト用 */

/* PC/TAB(SP兼用)パターン */
.u_lview_01 { display: block; }
.u_mview_01 { display: none; }
@media (max-width: 768px) {
.u_lview_01 { display: none; }
.u_mview_01 { display: block; }
}

/* PC(TAB兼用)/SPパターン */
.u_lview_02 { display: block; }
.u_sview_02 { display: none; }
@media (max-width: 480px) {
.u_lview_02 { display: none; }
.u_sview_02 { display: block; }
}

/* PC/TAB/SPパターン */
.u_lview_03 { display: block; }
.u_mview_03 { display: none; }
.u_sview_03 { display: none; }
@media (max-width: 768px) {
.u_lview_03 { display: none; }
.u_mview_03 { display: block; }
.u_sview_03 { display: none; }
}
@media (max-width: 480px) {
.u_lview_03 { display: none; }
.u_mview_03 { display: none; }
.u_sview_03 { display: block; }
}