@charset "utf-8";
/***************************************************
information
	filename : app_article.css;
***************************************************/
html {margin: 0;padding: 0;box-sizing: border-box;}
*, *:before, *:after {box-sizing: inherit;}
/****************** 幅指定 ******************/
/**** 記事エリア ****/
article{
	padding:16px 0px 32px;
	border-radius: 4px;
	/* background:#fff; */
}


.formThanks .articleBox p,
.formThanks .articleBox table,
.formThanks .DLBox,
.formThanks .articleBox ul,
.formThanks .articleBox ol,
.formThanks .videoMax,
.formThanks .policy {width: 100%;}

.formThanks .articleBox p.widths {width: 90%;}

.sp_prev .mainVisual,
.sp_prev .articleBox,
.sp_prev .articleBox p,
.sp_prev .articleBox table,
.sp_prev .DLBox,
.sp_prev .articleBox ul,
.sp_prev .articleBox ol,
.sp_prev .videoMax,
.sp_prev .policy {width: 100%;}

.sp_prev .articleBox p.widths {width: 90%;}

/****************** 記事エリア ******************/

/* 記事エリア */
.articleBox {margin: 0 auto;padding: 0;}


/**** span要素基本 ****/
.articleBox span.mck {
	background: linear-gradient(transparent 50%, var(--app-main-txt-ar) 50%);
}
.articleBox span.ubdr {
	color: var(--main-txt-ub);
	border-bottom: 2px solid var(--app-main-txt-ub);
}
/**** table要素基本 ****/
.articleBox table {
	margin: 20px auto;
	border: 1px solid var(--app-main-brd);
}
.articleBox th {
	padding: 15px;
	background: var(--app-main-cr-a);
	border: 1px solid var(--app-main-brd);
}
.articleBox td {
	padding: 15px;
	border: 1px solid var(--app-main-brd);
}
/* DLタグ */
.DLBox {
	margin: 30px auto;
	padding: 0;
	font-size:16px;
	border-top: 1px solid var(--app-main-brd-a);
}
.DLBox dl {margin: 0 auto;padding: 0;border-bottom: 1px solid var(--app-main-brd-a);}
.DLBox dt {float:left;width:25%;margin: 0;padding: 15px 10px;}
.DLBox dd {float:left;width:60%;margin: 0;padding: 15px 10px;}

.DLBox dl.bga {background: var(--app-main-cr-u);}
.DLBox dl.bgb {background: var(--app-main-cr-u);}

/* リスト */
.articleBox ul,
.articleBox ol {
	margin: 0 auto;
	padding: 0 20px;
	font-size: 16px;
	line-height: 1.4em;
}
.articleBox ul li {margin-top: 5px;margin-left: 5px;margin-bottom: 5px;}
.articleBox ol li {margin-top: 5px;margin-left: 5px;margin-bottom: 5px;}

/* 個別画像サイズ指定 */
.articleBox img {max-width: 100%;height: auto;}

/*** ビデオ埋め込み共通 ***/
.videoMax{margin: 0 auto;max-width:100%;}

/* *************************
テンプレート対応 
************************* */
/* プライバシーポリシー */
.policy {margin: 0 auto;}

.articleBox .policy h2 {
	padding: 10px 15px;
	font-size: 22px;
	font-weight: bold;
	text-align: left;
	border-bottom: 1px solid var(--app-main-brd);
}
.articleBox .policy h3 {
	margin: 20px auto;
	padding: 10px 15px;
	font-size: 16px;
	font-weight: bold;
	text-align: left;
}
/* 囲みリスト */
.LiBox_style1 {
	margin: 30px auto;
	padding: 10px 15px;
	background: var(--app-main-cr-a);
	border: 2px solid var(--app-main-brd);
	border-radius: 3px;
}
/* サービス購入ボタン */
.sv_order {
	margin: 30px auto;
	padding: 10px 0;
}
.sv_order .payAre {
	margin: 20px auto;
	padding: 20px 0;
	text-align: center;
}
.sv_order .payAre .pay_b  {
	font-size: 20px;
	line-height: 1.0em;
}
.sv_order .payAre .pay_b span.payB  {
	font-size: 50px;
	font-weight: bold;
}
.sv_order .payAre .pay_s  {
	font-size: 18px;
	line-height: 1.4em;
}
.sv_order .payAre .pay_caut {
	margin: 10px auto;
	padding: 15px 15px 0 15px;
	background: var(--app-main-cr-a);
	border: 2px solid var(--app-main-brd);
	border-radius: 3px;
}

/* 画像（上） */
.gallary_t {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin:24px auto;
}
.gallary_t .img {
    max-width: 90%;
    margin: 0 auto 16px;
}
.gallary_t .text {
    background: var(--app-main-cr-a);
    padding: 10px 20px;
}
/* 画像（左） */
.gallary_l {
    display: flex;
    justify-content: flex-start;
    margin:24px auto;
}
.gallary_l .img {
    width: 36%;
    flex-shrink: 0;
    margin-right: 16px;
}
.gallary_l .chara {
    display: flex;
    flex-direction: column;
    font-size: 16px;
    font-weight:600;
    margin: 0 0 8px 19px;
}
.gallary_l .chara .title{
    font-size: 14px;
}

.introBox {
    background: var(--app-main-cr-a);
    border: 4px solid var(--app-main-brd);
    padding: 8px 16px;
}
/* 画像（右） */
.gallary_r {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    margin:24px auto;
}
.gallary_r .img {
    width: 36%;
    flex-shrink: 0;
    margin-left: 16px;
}
.articleBox .LayoutR,
.articleBox .LayoutL {
    margin: 0 16px 16px;
}
.float .text p {
    display: grid;
    width: auto;
}

.float .text p:not([class]) {
    display: block;
}
/* イベント/地図 */
.event .info dl {
    display: flex;
    flex-direction: column;
    border: solid var(--app-glnv-cr);
    border-width: 1px 1px 1px 4px;
}

.event .info dt {
    border-bottom: 1px solid var(--app-glnv-cr);
    background: var(--app-main-cr-a);
    font-size: 14px;
    padding: 0.5em 16px;
}

.event .info dd {
    padding: 0.5em 16px;
}

.event .map {
    width: 100%;
    height: 450px;
    text-align: center;
}

.event .map iframe {
    width: 90%;
    padding: 24px 0;
    height: 100%;
    max-height:90vw;
}

/* 購入画面対応 */
.order_Box .articleBox,
.order_Box .articleBox .h2.style1,
.order_Box .articleBox .h2.style2,
.order_Box .articleBox .h2.style3,
.order_Box .articleBox h3.style1,
.order_Box .articleBox h3.style2,
.order_Box .articleBox h3.style3,
.order_Box .articleBox table,
.order_Box .DLBox,
.order_Box .articleBox ul,
.order_Box .articleBox ol,
.order_Box .videoMax,
.order_Box .policy,
.order_Box .articleBox p.widths,
.order_Box .articleBox h4.style1,
.order_Box .articleBox h4.style2,
.order_Box .articleBox h4.style3,
.order_Box .articleBox h5.style1 {width: 90%;}

/* ===================================================================================
for Ipad max-width: 1024px
=================================================================================== */
@media screen and (min-width:768px) and ( max-width:1024px) {

	/****************** 幅指定 ******************/
	.articleBox {width: var(--main-width-con-ipad);}
	.mainVisual, .articleBox h2.style1, .articleBox h2.style2, .articleBox h2.style3, .articleBox h3.style1, .articleBox h3.style2, .articleBox h3.style3, .articleBox table, .DLBox, .articleBox ul, .articleBox ol, .videoMax, .policy {width: var(--app-main-width-con-ipad);}

	.articleBox p.widths,
	.articleBox h4.style1,
	.articleBox h4.style2,
	.articleBox h4.style3,
	.articleBox h5.style1 {width: var(--app-main-width-con-s-ipad);}

	.popup .mainVisual {width: 100%;}
	.popup .articleBox,
	.popup .articleBox h2.style1,
	.popup .articleBox h2.style2,
	.popup .articleBox h2.style3,
	.popup .articleBox h3.style1,
	.popup .articleBox h3.style2,
	.popup .articleBox h3.style3,
	.popup .articleBox table,
	.popup .DLBox,
	.popup .articleBox ul,
	.popup .articleBox ol,
	.popup .videoMax,
	.popup .policy,
	.popup .articleBox p.widths,
	.popup .articleBox h4.style1,
	.popup .articleBox h4.style2,
	.popup .articleBox h4.style3,
	.popup .articleBox h5.style1 {width: 90%;}

}

/* ===================================================================================
for SP max-width: 480px
=================================================================================== */
@media screen and (max-width: 480px) {

	/* メインビジュアル（システム登録反映箇所） */
	.mainVisual {
		width: 100%;
	}

	/**** pタグ要素基本 ****/
	.articleBox {width: 100%;}
	.articleBox p {
		width: 100%;
		padding: 20px 10px;
		font-size: 4.2vw;
		line-height: 1.8em;
	}
	.articleBox p.style1,
	.articleBox p.style2,
	.articleBox p.style3,
	.articleBox p.style4,
	.articleBox p.style5 {
		margin: 20px auto;
	}
	.articleBox p.widths {
		width: 85%;
	}
	/**** タイトル要素基本 ****/
	.articleBox h2 {
		padding: 20px 10px;
		font-size: 5.0vw;
		font-weight: bold;
	}
	.articleBox h2.style1 {
		width: 100%;
	}
	.articleBox h2.style2,
	.articleBox h2.style3 {
		width: 90%;
	}
	.articleBox h3 {
		padding: 10px 5px;
		font-size: 5.0vw;
		font-weight: bold;
	}
	.articleBox h3.style1,
	.articleBox h3.style2,
	.articleBox h3.style3 {
		width: 90%;
	}
	.articleBox h4 {
		margin: 20px auto 10px auto;
		padding: 10px;
		font-size: 5.0vw;
	}
	.articleBox h4.style1,
	.articleBox h4.style2 {
		width: 90%;
	}
	.articleBox h4.style3 {
		width: 90%;
		padding: 10px 10px 15px 10px;
	}
	.articleBox h5 {
		margin: 5px auto;
		padding: 10px;
		font-size: 5.0vw;
	}
	.articleBox h5.style1 {
		width: 85%;
	}
	/**** table要素基本 ****/
	.articleBox table {
		width: 90%;
	}
	.articleBox th {
		padding: 10px;
	}
	.articleBox td {
		padding: 10px;
	}
	/* DLタグ */
	.DLBox {
		width: 90%;
		margin: 30px auto;
		padding: 0;
		font-size:4.2vw;
	}
	.DLBox dl {}
	.DLBox dt {float:left;width:30%;margin: 0;padding: 15px 5px;}
	.DLBox dd {float:left;width:65%;margin: 0;padding: 15px 5px;}

	/* リスト */
	.articleBox ul,
	.articleBox ol {
		width: 90%;
		margin: 0 auto;
		padding: 0 10px;
		font-size: 4.2vw;
		line-height: 1.6em;
	}

	/* 個別画像サイズ指定 */

	/**** テンプレート基本 ****/
	.policy {width: 90%;}

	.articleBox .policy h2 {
		padding: 10px 5px;
		font-size: 5.0vw;
	}
	.articleBox .policy h3 {
		padding: 10px 15px;
		font-size: 4.2vw;
	}
	/* *************************
	テンプレート対応 
	************************* */
	/*  award  */
	#award {
		background: url(../../../../images/site/award_header_sp.png)center top / 100% no-repeat,url(../../../../images/site/award_footer_sp.png)center bottom/ 100% no-repeat,#F4F0E6;
		padding: 20vw 4%;
	}
	#award h2 {
		margin: 1em auto;
	}
	.gallary_l{flex-direction:column;}
	.gallary_r{flex-direction:column-reverse;}
	.gallary_l .img,.gallary_r .img {
		width: 90%;
		margin: auto;
		text-align: center;
	}
	.gallary_l .text,.gallary_r .text {
		padding: 10px 20px;
	}
	.gallary_t, .gallary_l, .gallary_r, .float,.event {
		margin: 16px;
	}
	/* 囲みリスト */
	.LiBox_style1 {
		margin: 10px auto;
		padding: 10px 5px;
	}
}

/* 以下樋口追加分　220723*/
.media_box {
    display: flex;
    /* gap: 52px; */
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--app-header-cr);
    border-radius: 10px;
    padding: 14px 40px;
    height: 244px;
    width: 70%;
    margin: 0 auto;
}

.book_image {
    max-width: 40%;
    height: 100%;
}

.book_image img {
    object-fit: contain;
    height: 100%;
    width: auto;
    aspect-ratio: 1 / 1.6;
    border-radius: 5px;
}

.book_link_btn {
    background-color: orange;
    width: 80%;
    height: 35px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

.book_info {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 48px 0;
}
.articleBox .book_info a{
	color:#000;
	display:flex;
	justify-content:center;
	align-items:center;
	width:100%;
	height:100%;
	
}
.articleBox .book_link_btn a{
	color:#fff;
}
@media screen and (max-width: 540px) {
	.media_box {
	    display: flex;
	    align-items: center;
	    justify-content: space-between;
	    border: 1px solid var(--app-header-cr);
	    border-radius: 10px;
	    padding: 16px 20px;
	    height: 180px;
	    width: 100%;
	    margin: 0 auto;
	}

	.book_image {
	    max-width: 40%;
	    height: 100%;
	}

	.book_image img {
	    object-fit: contain;
	    height: 100%;
	    width: auto;
	    aspect-ratio: 1 / 1.6;
	    border-radius: 5px;
	}

	.book_link_btn {
	    background-color: orange;
	    width: 90%;
	    height: 30px;
	    margin: 0 auto;
	    display: flex;
	    align-items: center;
	    justify-content: center;
	    border-radius: 15px;
	}

	.book_info {
	    display: flex;
	    flex-wrap: nowrap;
	    flex-direction: column;
	    justify-content: space-between;
	    height: 100%;
	    width: 60%;
	    padding: 20px 0;
	}
	.articleBox .book_info .book_name p{
		margin: 0;
	}
	
}

/***************************************************
規約系テンプレート
***************************************************/
/* プライバシーポリシー */
.info article{
	margin-top:24px;
  }
.info article p{
	font-size:var(--txt-size-s);
}
@media screen and (max-width:440px){
	.info article h2{
		font-size:16px;
	}
}
/* 会社概要 */
.company{
	padding:16px 48px 0px;
}
.company dl {
	display: flex;
	border-bottom: 1px solid #DDDDDD;
	padding: 20px 0px 20px 0px;
  }
  @media screen and (max-width:540px) {
	.company{
		padding:16px 24px 0px;
	}
	.company dl {
	  font-size: 14px;
	  flex-wrap: wrap;
	}
  }
  .company dl:last-child {
	border-bottom: none;
  }
  .company dt {
	width: 20%;
  }
  @media screen and (max-width:540px) {
	.company dt {
	  width: 100%;
	  margin-bottom: 10px;
	}
  }
  .company dd {
	width: 80%;
	padding-left: 16px;
  }
  @media screen and (max-width:540px) {
	.company dd {
	  padding-left: 12px;
	  width: 100%;
	}
}
/***************************************************
閲覧不可時 テンプレート
***************************************************/
.closedBox{
  width:71%;
  padding:40px 0px 16px;
  margin:32px auto;
  border:2px solid var(--app-gray-brd);
  position:relative;
}

.closedBox::before{
  position:absolute;
  content:'';
  background:#fff;
  width:32px;
  height:38px;
  top:-6px;
  left:-6px;
}
.closedBox::after{
  position:absolute;
  content:'';
  background:url(../../../../images/contents/icon_conBox_key.png)no-repeat;
  background-size:contain;
  width:26px;
  height:26px;
  top:-6px;
  left:-6px;
}

.closedBox__title{
  font-size:20px;
  font-weight:bold;
  text-align: center;
}
.closedBox__title span{
  color:var(--app-main-cr);
}

@media screen and (max-width:540px){
  .closedBox{
    width:85%;
    padding:40px 0px 16px;
    margin:32px auto;
    border:1px solid var(--app-main-brd);
  }
  .closedBox::after{
    width:24px;
    height:24px;
    left:-4px;
  }
  .closedBox__title{
    font-size:17px;
  }
}

/***************************************************
フォーム完了画面　テンプレ
***************************************************/

/* 完了アイコン */
.iconCheck{
	position:relative;
	padding-top:48px;
  }
  .iconCheck:before{
	position:absolute;
	content:'';
	background:var(--app-main-txt);
	width:48px;
	height:48px;
	border-radius: 50%;;
	top:-13px;
	left:50%;
	transform:translateX(-50%);
  }
  .iconCheck:after{
	position:absolute;
	content:'';
	background:url(../../images/contents/icon_conBox_check.png)no-repeat;
	background-size:contain;
	width:25px;
	height:25px;
	top:0px;
	left:50%;
	transform:translateX(-50%);
  }  

/***************************************************
記事内テキスト装飾パーツ
***************************************************/
/************　本文パーツ　***********/
/* マーカー（メイン） */
.mck{
	background:#fdeeee;
	color:var(--app-main-cr-c);
	border-bottom: 1px dashed var(--app-main-cr-c);
	padding: 5px 5px 4px;
}
/* マーカー（サブ） */
.mck_sub{
	background:#eceef9;
	padding: 5px;
}
/* アンダーライン */
.uline{
	color:var(--app-main-txt);
	border-bottom: 1px dashed var(--app-main-txt);
    padding-bottom: 5px;
}
/* p 補足 */

@media screen and (max-width:540px){
	.uline{
		padding-bottom: 3px;
	}
}
/************　タイトルパーツ　***********/
/* メインタイトル */
.mainT{
	color:var(--app-main-cr);
	padding-bottom:4px;
	border-bottom:4px solid #f7f7f7;
}
/* サブタイトル */
h2.subT,h3.subT{
	color:var(--app-main-cr);
	padding-bottom:4px;
	border-bottom:1px solid #f2f2f2;
	border-top:none;
margin-top:24px;
text-align:left;
}
/* h2 */
/* h3 */
/* h4 */
/* h5 */

/***************************************************
記事内テンプレート　パーツ
***************************************************/
hr{
	border: none;
	border-top:1px solid var(--app-gray-brd);
}
/************　記事内テンプレート　パーツ　***********/
/* 記事テンプレ */
/* 動画テンプレ */

/************　囲みBOX　***********/
.baseBox,.lineBox,.listBox{
	padding:16px 0px;
}
.box__title p{
	color:var(--app-main-txt);
	font-weight:bold;
}
/* 囲みBOX1 */
.baseBox{
	background:var(--app-gray-bg);
}
/* 囲みBOX2 */
.lineBox{
	border:1px solid var(--app-gray-brd);
}
/* 囲みBOX3 */
.gray{
	border:1px solid var(--app-gray-brd);
}
.gray p{
	color:var(--app-gray-txt);
}
/************　強調BOX　***********/
.pointBox{
	background:var(--app-gray-bg);
	padding-bottom:8px;
	margin:16px auto;
}
.pointBox .box__title{
	background:var(--app-main-c-txt);
	padding:1px;
}
.pointBox .box__title p{
	color:#fff;
	font-weight:bold;
	text-align: center;
	margin:0px;
}
.pointBox .box__title.icon{
	background:var(--app-main-cr-c);
	text-align: center;
}
.box__title.icon p{
	display:inline-block;
	position:relative;
}
.box__title.icon p:before{
	position:absolute;
	content:'';
	width:15px;
	height:9px;
	border-left:3px solid #fff;
	border-bottom:3px solid #fff;
	top:22%;
	left:-22px;
	transform:rotate(-45deg);
}
/* 強調BOX1 */

/* 強調BOX2 */

/************　リストBOX　***********/
/* リストBOX1 */
.listBox ul li{
	padding-left:20px;
	position:relative;
}
.listBox ul li:before{
	position:absolute;
	content:'';
	background:var(--app-main-txt);
	width:4px;
	height:4px;
	border-radius: 50%;
	top:50%;
	left:0;
	transform:translateY(-50%);
}
/* リストBOX2 */
.listBox ol{
	counter-reset: item;
  	list-style-type: none;
	position:relative;
}
.listBox ol li:before{
	counter-increment: item;
 	content: counter(item)'. ';
	color:var(--app-main-txt);
	font-weight:bold;
}
/* リストBOX3 */
ol.countType2 li:before{
	color:#fff;
	font-size:80%;
	background:var(--app-main-txt);
	content: counter(item)'';
	padding:5.5px 7.6px 5px;
	margin-right:6px;
	border-radius: 50%;
}
/************ 強調テキスト　***********/

/* 強調テキスト1 */
.pointText{
	margin:16px auto;
}
.pointText p.check{
	padding-left:20px;
	margin-top:4px;
	margin-bottom:4px;
	font-size:105%;
	font-weight:bold;
	position:relative;
}
.pointText p.check:before{
	position:absolute;
	content:'';
	width:24px;
	height:14px;
	border-left:4px solid var(--app-main-cr-c);
	border-bottom:4px solid var(--app-main-cr-c);
	top:50%;
	left:-16px;
	transform:translateY(-70%)rotate(-45deg);
}
/* 強調テキスト2 */
.pointText p.check.sub:before{
	border-left:4px solid var(--app-main-c-txt);
	border-bottom:4px solid var(--app-main-c-txt);
}
@media screen and (max-width:540px){
	.pointText p.check:before{
		width:22px;
		height:12px;
		left:-12px;
	}
}
/************ 見出し装飾　***********/
/* タグタイトル */
.tagTitle {
	display:flex;
	align-items: center;
	padding:0px;
	margin:40px 48px 24px;
}
.tagTitle .tagTitle__mark{
	background:var(--app-main-txt);
	color:#fff;
	font-size:95%;
	padding:3px 12px 2px;
	margin-right:12px;
}
.tagTitle__mark.strong{
	background:var(--app-main-cr-c);
}
.tagTitle h3,.tagTitle h4{
	margin:0;
	border:none;
	background:none;
	text-align: left;
	color:var(--app-glnv-txt);
}
/************ ふきだしテキスト　***********/
/* ふきだしテキスト左 */
.serifBox{
	display:flex;
	align-items: center;
}
.serifBox__img img{
	width:96px;
	height:96px;
	border-radius: 50%;
	border:2px solid var(--app-gray-brd);
}
.serifBox__text p{
	min-width: 400px;
	padding:20px 32px;
	background:var(--app-gray-bg);
	border-radius: 8px;
	margin:0 0 0 20px;
	position:relative;
}
.serifBox__text p:before{
	position:absolute;
	content:'';
	border-style: solid;
	border-width: 10px 10px 10px 0;
	border-color: transparent var(--app-gray-bg) transparent transparent;
	left:-10px;
	top:50%;
	transform:translateY(-50%);
}
/* ふきだしテキスト右 */
.serif-right.serifBox{
	flex-direction:row-reverse ;
}
.serif-right .serifBox__text p{
	margin:0 20px 0 0;
}
.serif-right .serifBox__text p:before{
	border-width: 10px 0 10px 10px;
	border-color: transparent transparent transparent var(--app-gray-bg);
	left:auto;
	right:-10px;
}
@media screen and (max-width:540px){
	/* .serifBox{
		align-items: flex-start;
	} */
	.serifBox__img img{
		width:72px;
		height:72px;
	}
	.contents .serifBox__text p{
		margin:12px;
	}	
	.serifBox__text p{
		min-width: auto;
		width:95%;
		padding:16px 20px;
	}	
}
/************ 関連BOX　***********/
/* 関連BOX1 */
.kanrenBox{
	display:flex;
}
.kanrenBox__img {
	margin:0 16px;
}
.kanrenBox__text {
	margin:0 16px 0 0;
}
.kanrenBox__text--tag{
	display:inline-block;
	background:var(--app-main-cr);
	color:#fff;
	font-size:85%;
	padding:2px 8px 1px;
}
.kanrenBox__text--title{
	font-size:18px;
	font-weight:bold;
	color:var(--app-glnv-txt);
	padding:8px 0 4px;
	border-bottom: 1px solid var(--app-gray-brd);
}
.kanrenBox__text--detail{
	color:var(--app-gray-txt);
	padding:8px 0;
	font-size:90%;
}
/* 関連BOX2 */
.lineBox.strong{
	border:1px solid var(--app-main-cr-c);
}
.kanrenBox.strong .kanrenBox__text--tag{
	background:var(--app-main-cr-c);
}
/* 関連BOX3 */
/************ アイコンBOX　***********/

/* アイコンBOX */
/************ 動画埋込BOX　***********/

/* 動画埋込BOX */

/************　画像BOX　***********/

/* 画像中サイズ */
/* 画像大サイズ */
.imgBox img{
	width:100%;
	margin:16px auto;
}
/* 画像横並び２列 */
.imgBox_col2{
	display:flex;
}
.imgBox_col2 .imgBox__item{
	width:50%;
	padding:4px;
}
@media screen and (max-width:767px){
	.imgBox img{
		height:100%;
	}	
	.imgBox_col2{
		display:block;
	}	
	.imgBox_col2 .imgBox__item{
		width:100%;
	}
}
/************　質問BOX　***********/

/* 質問BOX1 */
.qaBox__title{
	position: relative;
	padding-left: 12px;
	border-left: none;
	margin-bottom: 0px;
}
.qaBox__title:before{
	position: absolute;
	content: "Q";
	color: #fff;
	background: var(--app-main-cr-c);
	border-radius: 50%;
	padding: 8px 15.5px;
	top: 50%;
	left: 0px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	font-size: 16px;
}
.qaBox__title p{
	font-size: 18px;
}
.qaBox__text{
	position: relative;
	padding-left: 12px;
  }
  .qaBox__text:before {
	position: absolute;
	content: "A";
	color: #fff;
	background: var(--app-main-cr);
	border-radius: 50%;
	padding: 8px 15.5px;
	top: 10px;
	left: 0px;
	font-weight: bold;
  }
/* 質問BOX2 */

