/* #############################################################
============================= only =============================
############################################################# */

.onlyPc_inline {
	display: inline !important;
}

.onlyPc_block {
	display: block !important;
}

.onlyPc_flex {
	display: flex !important;
}

.onlyPc_table {
	display: table !important;
}


.onlyTablet_inline {
	display: none !important;
}

.onlyTablet_block {
	display: none !important;
}

.onlyTablet_flex {
	display: none !important;
}

.onlyTablet_table {
	display: none !important;
}


.onlyMobile_inline {
	display: none !important;
}

.onlyMobile_block {
	display: none !important;
}

.onlyMobile_flex {
	display: none !important;
}

.onlyMobile_table {
	display: none !important;
}

/* =============================================================
============================== but =============================
============================================================= */

.butPc_inline {
	display: none !important;
}

.butPc_block {
	display: none !important;
}

.butPc_flex {
	display: none !important;
}

.butPc_table {
	display: none !important;
}


.butTablet_inline {
	display: inline !important;
}

.butTablet_block {
	display: block !important;
}

.butTablet_flex {
	display: flex !important;
}

.butTablet_table {
	display: table !important;
}


.butMobile_inline {
	display: inline !important;
}

.butMobile_block {
	display: block !important;
}

.butMobile_flex {
	display: flex !important;
}

.butMobile_table {
	display: table !important;
}

/* #############################################################
============================= page =============================
############################################################# */

/* =============================================================
============================= whole ============================
============================================================= */

html {
	font-size: 13px;
}

/* #############################################################
========================== pageHeader ==========================
############################################################# */

.pageHeader {
	padding: 10vmin 0;
	font-size: 10vmin;
}

.pageHeader > a {
	letter-spacing: 0.3em;
}

/* #############################################################
============================= nav =============================
############################################################# */

.flexNav {
	font-size: 1.6rem;
}

.flexNav > a {
	height: 7vmin;
	line-height: 7vmin;
	flex-basis: 20%;
}

.flexNav > .pnl {
	top: -30.15vmin;
	height: 30.15vmin;
}

#pnl1, #pnl2, #pnl3, #pnl4, #pnl5, #pnl6, #pnl7, #pnl8, #pnl9, #pnl10 {
	font-size: 10vmin;
	padding: 10vmin 0;
	letter-spacing: 0.2em;
}

.flexNav > a:hover + .pnl {
	transform: translateY(30.1vmin);
}

/* =============================================================
=========================== headers ============================
============================================================= */

/* -------------------------------------------------------------
------------------------------ h1 ------------------------------
------------------------------------------------------------- */

.articleHeader {
	font-size: 2.3rem;
}

/* -------------------------------------------------------------
------------------------------ h2 ------------------------------
------------------------------------------------------------- */

.aH2 > label {
	font-size: 2.1rem;
}

/* -------------------------------------------------------------
------------------------------ h3 ------------------------------
------------------------------------------------------------- */

.aH3 > label {
	font-size: 1.9rem;
}

/* -------------------------------------------------------------
------------------------------ h4 ------------------------------
------------------------------------------------------------- */

h4 {
	font-size: 1.4rem;
}

/* -------------------------------------------------------------
------------------------------ h5 ------------------------------
------------------------------------------------------------- */

h5 {
	font-size: 1.2rem;
}

/* =============================================================
=========================== flexBox ============================
============================================================= */

.flexBox {
	font-size: 1rem;
}

.flexBox > small {
	font-size: 0.8rem;
}

/* -------------------------------------------------------------
------------------------- flexBoxMax ---------------------------
------------------------------------------------------------- */

.flexBoxMax > small {
	font-size: 0.8rem;
}

/* -------------------------------------------------------------
-------------------------- videoBox ---------------------------
------------------------------------------------------------- */

.videoBox > .videoLabel {
	font-size: 0.9rem;
}

/* =============================================================
============================ table =============================
============================================================= */

table {
	font-size: 1.2rem;
}

/* =============================================================
========================= forOverFlow ==========================
============================================================= */

/* -------------------------------------------------------------
-------------------------- notifBox ----------------------------
------------------------------------------------------------- */

.articleBody > .contentBox > .notifBox {
	font-size: 1rem;
}

/* =============================================================
============================ form ==============================
============================================================= */

.formLabel {
	font-size: 1.2rem;
}

.formInput {
	font-size: 1.1rem;
}

.formTextarea {
	font-size: 1.2rem;
}

.formBtn {
	font-size: 1.3rem;
}

/* #############################################################
=========================== padding ============================
############################################################# */
/* #############################################################
========================== font-size ===========================
############################################################# */

/* =============================================================
============================== p ===============================
============================================================= */

.articleBody > .contentBox > p {
	padding: 0 8vmin 2.5vmin;
	font-size: 1.2rem;
}

/* -------------------------------------------------------------
--------------------------- colorBox ---------------------------
------------------------------------------------------------- */

.colorBox > p {
	padding: 3vmin 5vmin;
	font-size: 1.2rem;
}

/* -------------------------------------------------------------
--------------------------- extraBox ---------------------------
------------------------------------------------------------- */

.extraBox > p {
	padding: 3vmin 4vmin;
	font-size: 1.2rem;
}

/* -------------------------------------------------------------
-------------------------- h3TabBody ---------------------------
------------------------------------------------------------- */

/* ===================== h3TBoxTabLabel ===================== */

.aH3 > .contentBox > .tabBody > .boxTab {
	font-size: 1.4rem;
}

/* =============================================================
=========================== flexBox ============================
============================================================= */

/* ======================= flex30%@Pc ======================= */

/* ----------------------- flex45%@Mobile ------------------- */

.flexPart > p {
	flex-basis: 30%;
}

/* ======================= flex45%@Pc ======================= */

/* ----------------------- flex95%@Mobile ------------------- */

.flexPart > .pc45mob95 {
	flex-basis: 45%;
}

/* ======================= flex70%@Pc ======================= */

/* ----------------------- flex95%@Mobile ------------------- */

.flexPart > .pc70mob95 {
	flex-basis: 70%;
}

/* #############################################################
========================== pageFooter ==========================
############################################################# */

small {
	font-size: 0.8rem;
}

