@charset "utf-8";
/***************************************************
information
  filename : box_parts.css;
***************************************************/

/*======== app_box_dez.css ========*/
/******************************************* ボックスパーツ設定 *******************************************/

/****************** 入力フォーム基本指定 ******************/

/* ** input_basic start ** */
/****************** フォーム共通指定 ******************/

/*** 入力フォーム基本 ***/

/* 入力フォーム項目基本指定 */
.InputForm dl {
	margin: 0 auto;
	padding: 1.0rem 0;
	display: flex;
	font-weight:bold;
	align-items: center;
	font-size: clamp(1.6rem, 1.6vw, 1.6rem);
	border-bottom: var(--app-InputForm-brd);
}
.InputForm dt {padding: 1.0rem 0 1.0rem 0.8rem;display: flex;align-items: center;}
.InputForm dd {padding: 1.0rem 0;}
.InputForm dd ul.chpd {padding-top: 1.0rem;}
.InputForm dd li {list-style: none;}

/*** 項目幅指定 ***/
.InputForm dt {width: 35%;}
.InputForm dd {width: 65%;}

/* 入力フォーム見出し項目縦並び（主にログイン等ボーダー無し） */
.InputFormT dl {margin: 0 auto;padding: 0 0 1.0rem 0;font-weight:bold;font-size: var(--font-form-dt);
}.InputFormT dt {padding: 0.8rem;}
.InputFormT dd {padding: 0;}

@media screen and (max-width: 600px) {
	.InputForm dl {display: block;}
	.InputForm dt {width: 100%;padding-bottom: 1.0rem;}
	.InputForm dd {width: 100%;}
	.InputForm dd p.chpd {padding-left: 1.0rem;}
	.InputForm dl.spchkDl {display: flex;}
	.InputForm dl.spchkDl dt {width: 40%;padding: 1.0rem 0 0.5rem 0.8rem;}
	.InputForm dl.spchkDl dd {width: 60%;}
	.InputForm dl.spchkDl dd p.chpd {padding-left: 0;}
}
/* ** input_basic end ** */

/* ** com_box start ** */
/*** 基本ボックス ***/
/* 枠ボックス */
.comBox {
	margin-left: auto;
	margin-right: auto;
	padding: 1.5rem;
	color: var(--app-BgBox-txt); /* テキスト色 */
	border-radius: var(--BgBox-rod);-webkit-border-radius: var(--BgBox-rod);-moz-border-radius: var(--BgBox-rod); /* 角丸 */
	border: var(--app-BgBox-brd); /* 外枠ボーダー指定 */
	background: var(--app-BgBox-bg); /* 外枠背景色 */
	box-shadow: var(--app-BgBox-sd);-webkit-box-shadow: var(--app-BgBox-sd); /* 外枠背景影色 */
}
.comBoxInn {
	margin-left: auto;
	margin-right: auto;
	padding: 1.5rem;
	border-radius: var(--BgBox-rod);-webkit-border-radius: var(--BgBox-rod);-moz-border-radius: var(--BgBox-rod); /* 角丸 */
	border: var(--app-BgBoxInn-brd); /* 内枠ボーダー指定 */
	background: var(--app-BgBoxInn-bg); /* 内枠背景色 */
	box-shadow: var(--app-BgBoxInn-sd);-webkit-box-shadow: var(--app-BgBoxInn-sd); /* 内枠背景影色 */
}
.comBoxMgtb {margin-top: 1.0rem;margin-bottom: 1.0rem;}

/* ** com_box end ** */

/* ** colorbox_basic start ** */
/********* インラインポップ設定 *********/

/* ポップアップ */
.popup_Box {width: 95%;margin: 0 auto;padding: 1.0rem 0.5rem;}

/* ポップアップタイトル */
.popupTi {
	margin: var(--app-popupTi-mg); /* マージン */
	padding: var(--app-popupTi-pd); /* パディング */
	text-align: center;
	line-height: 1.0;
	color: var(--app-popupTi-txt); /* テキスト色 */
	font-weight: bold;
	background: var(--app-popupTi-bg); /* 背景色 */
	border-top: var(--app-popupTi-brd); /* ボーダー指定 */
	border-bottom: var(--app-popupTi-brd); /* ボーダー指定 */
}
.popupTi h1.popupTiInn,
.popupTi p.popupTiInn {font-size: var(--font-popupTi);font-weight: bold;} /* フォントサイズ */

@media screen and (max-width: 600px) {
	.popup #contents {margin: 0 auto;}
	.popup_Box {width: 100%;padding: 0.5rem;}
}
/* ** colorbox_basic end ** */

/* ** comment_box start ** */
/*** コメント・掲示板・レビュー投稿ボックス ***/
/* 枠ボックス */
.commentBox {
	width: var(--InputBaseBox-size); /* 登録画面画面サイズ */
	margin: 0 auto; /* マージン */
	padding: 0.5rem 1.8rem;
	color: var(--app-BgBox-txt); /* テキスト色 */
	border-radius: var(--BgBox-rod);-webkit-border-radius: var(--BgBox-rod);-moz-border-radius: var(--BgBox-rod); /* 角丸 */
	border: var(--app-BgBox-brd); /* ボーダー指定 */
	background: var(--app-BgBox-bg); /* 背景色 */
	box-shadow: var(--app-BgBox-sd); /* 背景影色 */
}
/* タイトルエリア */
.commentBox p.commentTtitle {
	margin: 0 auto;
	padding: 1.5rem 1.0rem;
	font-size: clamp(1.6rem, 1.6vw, 1.8rem);
	font-weight: bold;
	border-bottom: 1px dotted #cdcdcd;
	background: inherit;
}
/* 投稿用制御ボタン位置指定 */
.commentBT {
	float: right;
	width: 30%;
	margin 0;
	padding: 0 2.0rem 2.0rem 2.0rem;
}
/* 投稿フォーム */
.commentInput,
.commentForm {margin: 0;padding: 0.5rem 0;}

@media screen and (max-width: 600px) {
	.commentBT {width: 100%;padding: 0 0.5rem 2.0rem 0.5rem;}
	.commentInput {margin: 1.0rem auto;padding: 0.5rem 0;}
}
/*** コメント・掲示板・レビュー投稿コメント表示ボックス ***/

/* 枠ボックス */
.commentList {
	margin: 0 auto;
	padding: 1.0rem 1.5rem;
	border-radius: var(--BgBox-rod);-webkit-border-radius: var(--BgBox-rod);-moz-border-radius: var(--BgBox-rod); /* 角丸 */
	border: var(--app-BgBoxInn-brd);
	box-shadow: var(--app-BgBoxInn-sd);
}
/* コメントリスト背景指定（コメント無し） */
.commentZero {
	margin: 0 auto;
	background: var(--app-commentZero-bg);/* 背景色 */
}
/* コメントリスト背景指定（親スレッド） */
.commentFst {
	margin: 1.0rem auto 0 auto;
	background: var(--app-commentFst-bg);/* 背景色 */
}
/* コメントリスト背景指定（レスコメント） */
.commentSec {
	margin: 1.0rem 0 0 3.0rem;
	background: var(--app-commentSec-bg);/* 背景色 */
}
/* 投稿者写真表示 */
.commentPh {
	float: left;
	overflow: hidden;
	width: 50px;
	height: 50px;
	position: relative;
	border-radius: 50%;
}
.commentPh img{
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%;
	height: auto;
}
/* 投稿者情報表示エリア */
.commentTxtArea {width: 100%;}
.commentNameArea {
	padding: 0.5rem;
	border-bottom: var(--app-BgBox-Kbrd); /* ボーダー指定 */
}
.commentNameInn {float: right;text-align: right;}
@media screen and (max-width: 600px) {
	.commentNameInn {width: 75%;}
}
/* 投稿者ニックネーム */
.commentName {
	font-size: clamp(1.4rem, 1.2vw, 1.6rem);
	font-weight: normal;
}
/* 投稿者ID */
.commentName span.commentNameS {
	padding: 0 0 0 0.5rem;
	font-size: clamp(1.2rem, 1.0vw, 1.2rem);
	font-weight: normal;
}
/* 投稿ID・投稿時間 */
.commentTime {
	font-size: clamp(1.0rem, 1.0vw, 1.2rem);
	font-weight: bold;
}
/* 投稿返信元ID表示 */
.commentTxtRes {
	padding: 1.0rem 0.5rem 0 0.5rem;
	font-size: clamp(1.4rem, 1.2vw, 1.6rem);
	line-height: 1.8;
	font-weight: bold;
}
/* 投稿テキスト */
.commentTxt {
	padding: 1.5rem;
	font-size: clamp(1.6rem, 1.4vw, 1.6rem);
	line-height: 1.8;
}
@media screen and (max-width: 600px) {
	.commentTxt {padding: 1.5rem 0.5rem;}
}
/* 共感ボタン表示エリア */
.commentResArea {
	padding: 1.0rem 0 0.5rem 0; /* パディング */
	border-top: var(--app-BgBox-Kbrd); /* ボーダー指定 */
}
.commentResL {float: left;display: flex;align-items: center;}
.commentResR {float: right;display: flex;align-items: center;}
.commentResBT {margin: 0 0.2rem;}

/* ** comment_box end ** */

/* ** order_box start ** */
/******* サービス・セミナーの単品購入用の共通明細エリア *******/

/* 枠ボックス(主に明細処理で使用) */
.SCartBox {
	width: var(--InputBaseBox-size); /* 登録画面画面サイズ */
	margin: 0 auto 2.0rem auto; /* マージン */
	padding: 1.5rem;
	color: var(--app-BgBox-txt); /* テキスト色 */
	border-radius: var(--BgBox-rod);-webkit-border-radius: var(--BgBox-rod);-moz-border-radius: var(--BgBox-rod); /* 角丸 */
	border: var(--app-BgBox-brd); /* 外枠ボーダー指定 */
	background: var(--app-BgBox-bg); /* 外枠背景色 */
	box-shadow: var(--app-BgBox-sd);-webkit-box-shadow: var(--app-BgBox-sd); /* 外枠背景影色 */
}
.SCartBoxInn {
	padding: 1.5rem;
	border-radius: var(--BgBox-rod);-webkit-border-radius: var(--BgBox-rod);-moz-border-radius: var(--BgBox-rod); /* 角丸 */
	border: var(--app-BgBoxInn-brd); /* 内枠ボーダー指定 */
	background: var(--app-BgBoxInn-bg); /* 内枠背景色 */
	box-shadow: var(--app-BgBoxInn-sd);-webkit-box-shadow: var(--app-BgBoxInn-sd); /* 内枠背景影色 */
}
.popup_Box .SCartBox {
	width: 100%;
	margin: 0 auto 2.0rem auto; /* マージン */
	padding: 1.5rem;
	color: var(--app-BgBox-txt); /* テキスト色 */
	border-radius: var(--BgBox-rod);-webkit-border-radius: var(--BgBox-rod);-moz-border-radius: var(--BgBox-rod); /* 角丸 */
	border: var(--app-BgBoxInn-brd); /* 内枠ボーダー指定 */
	background: var(--app-BgBoxInn-bg); /* 内枠背景色 */
	box-shadow: var(--app-BgBoxInn-sd);-webkit-box-shadow: var(--app-BgBoxInn-sd); /* 内枠背景影色 */
}
@media screen and (max-width: 600px) {
	.SCartBox {width: 95%;margin: 0 auto;padding: 1.0rem;}
	.SCartBoxInn {padding: 1.0rem;}
}
/* ** order_box end ** */

/* ** credit_box start ** */
/*** クレジットカード情報 ***/
.cardBland,
.cardSec,
.cardAgt {margin: 0 auto;padding: 0;}
.cardImg {margin: 2.0rem auto;padding: 0;display: flex;}
.cardBland ul {padding: 0 2.0rem;}
.cardBland li,
.cardSec p {padding: 0.5rem;list-style: none;}
.cardAgtLogo {padding: 2.0rem 1.0rem;}
.cardAgtName {
	padding: 0 1.0rem;
	font-size: clamp(1.4rem, 1.0vw, 1.4rem);
	font-weight: bold;
}
.cardAjx {margin: 2.0rem auto;padding: 0;text-align: center;}

@media screen and (max-width: 600px) {
	:root {
	.cardImg {flex-wrap: wrap;}
	.cardSec .cardImg {display: block;}
	}
}
div.payjs-outer {
    margin: 2px;
    border: 1px solid #cdcdcd;
    width: 100%;
}
/* ** credit_box end ** */

/* ** contributor_box start ** */
/*** 記事投稿者ボックス ***/
/* 枠ボックス */
.authorBox {
	margin: 0 auto;
	padding: 1.0rem;
	color: var(--app-BgBox-txt); /* テキスト色 */
	border-radius: var(--app-BgBox-rod);-webkit-border-radius: var(--app-BgBox-rod);-moz-border-radius: var(--app-BgBox-rod); /* 角丸 */
	border: var(--app-BgBoxInn-brd); /*ボーダー指定 */
	background: var(--app-BgBoxInn-bg); /* 背景色 */
	box-shadow: var(--app-BgBoxInn-sd);-webkit-box-shadow: var(--app-BgBoxInn-sd);/* 背景影色 */
}
.authorBox .authorPhoto {float:left;width:20%;}
.authorBox .authorPhoto img {width:85%;border-radius: var(--app-authorBox-img-rod);} /* 写真角丸 */
.authorBox .authorDetail {float:right;width:80%;}

/* 記事投稿者エリアタイトル */
.authorBox .authorDetail p.authorDetTi {
	padding: 0 0 0.5rem 0;
	font-size: clamp(1.4rem, 1.2vw, 1.6rem);
	font-weight: bold;
	border-bottom: var(--app-BgBox-Kbrd);
}
.authorBox .authorDetail p.authorDetName {
	padding: 1.0rem 0 0.5rem 0;
	font-size: clamp(1.4rem, 1.6vw, 2.0rem);
	font-weight: bold;
	line-height: 1.2em;
}
.authorBox .authorDetail p.authorDetCorp {
	padding: 0;
	font-size: clamp(1.2rem, 1.2vw, 1.6rem);
}
.authorBox .authorDetail p.authorDetProf {
	padding-top: 1.0rem;
	font-size: clamp(1.2rem, 1.2vw, 1.6rem);
	line-height: 1.4em;
}
@media screen and (max-width: 600px) {
	.authorBox {
		width: 95%;
		margin-left: auto;
		margin-right: auto;
	}
}
/* ** contributor_box end ** */