@charset "UTF-8";

/********************************************************************
	追加
********************************************************************/

/*高さ指定*/
.hight_01{height: auto;}

/*margin-bottom　外側の下方向にスペースを空けたい時に使用*/
.m_mb15{margin-bottom: -15px!important;}
.m_mb30{margin-bottom: -30px!important;}
.m_mb45{margin-bottom: -45px!important;}
.m_mb70{margin-bottom: -70px!important;}
.mb5{margin-bottom: 5px!important;}
.mb10{margin-bottom: 10px!important;}
.mb15{margin-bottom: 15px!important;}
.mb20{margin-bottom: 20px!important;}
.mb25{margin-bottom: 25px!important;}
.mb30{margin-bottom: 30px!important;}
.mb35{margin-bottom: 35px!important;}
.mb40{margin-bottom: 40px!important;}
.mb45{margin-bottom: 45px!important;}
.mb50{margin-bottom: 50px!important;}
.mb55{margin-bottom: 55px!important;}
.mb60{margin-bottom: 60px!important;}
.mb65{margin-bottom: 60px!important;}
.mb70{margin-bottom: 70px!important;}
.mb80{margin-bottom: 80px!important;}
.mb90{margin-bottom: 90px!important;}
.mb100{margin-bottom: 100px!important;}
.mb110{margin-bottom: 110px!important;}
.mb120{margin-bottom: 120px!important;}
.mb130{margin-bottom: 130px!important;}
.mb150{margin-bottom: 150px!important;}
.mb155{margin-bottom: 155px!important;}
.mb160{margin-bottom: 160px!important;}
.mb165{margin-bottom: 165px!important;}
.mb180{margin-bottom: 180px!important;}
.mb200{margin-bottom: 200px!important;}
.mb220{margin-bottom: 220px!important;}
.mb280{margin-bottom: 280px!important;}
.mb300{margin-bottom: 300px!important;}
.mb490{margin-bottom: 490px!important;}


/*margin-bottom　%調整　外側の下方向にスペースを空けたい時に使用*/
.mb1_per{margin-bottom: 1%!important;}
.mb2_per{margin-bottom: 2%!important;}
.mb3_per{margin-bottom: 3%!important;}
.mb4_per{margin-bottom: 4%!important;}
.mb5_per{margin-bottom: 5%!important;}
.mb6_per{margin-bottom: 6%!important;}
.mb7_per{margin-bottom: 7%!important;}
.mb8_per{margin-bottom: 8%!important;}
.mb9_per{margin-bottom: 9%!important;}
.mb9-4_per{margin-bottom: 9.4%!important;}
.mb9-5_per{margin-bottom: 9.5%!important;}
.mb10_per{margin-bottom: 10%!important;}
.mb11_per{margin-bottom: 11%!important;}
.mb12_per{margin-bottom: 12%!important;}
.mb12-5_per{margin-bottom: 12.5%!important;}
.mb13_per{margin-bottom: 13%!important;}
.mb14_per{margin-bottom: 14%!important;}
.mb15_per{margin-bottom: 15%!important;}
.mb15-2_per{margin-bottom: 15.2%!important;}
.mb15-8_per{margin-bottom: 15.8%!important;}
.mb16_per{margin-bottom: 16%!important;}
.mb16-5_per{margin-bottom: 16.5%!important;}
.mb17_per{margin-bottom: 17%!important;}
.mb18_per{margin-bottom: 18%!important;}
.mb20_per{margin-bottom: 20%!important;}
.mb25_per{margin-bottom: 25%!important;}
.mb30_per{margin-bottom: 30%!important;}
.mb35_per{margin-bottom: 35%!important;}
.mb40_per{margin-bottom: 40%!important;}
.mb45_per{margin-bottom: 45%!important;}
.mb50_per{margin-bottom: 50%!important;}
.mb55_per{margin-bottom: 55%!important;}
.mb60_per{margin-bottom: 60%!important;}
.mb65_per{margin-bottom: 60%!important;}
.mb70_per{margin-bottom: 70%!important;}
.mb80_per{margin-bottom: 80%!important;}
.mb90_per{margin-bottom: 90%!important;}
.mb100_per{margin-bottom: 100%!important;}
.mb110_per{margin-bottom: 110%!important;}
.mb120_per{margin-bottom: 120%!important;}
.mb130_per{margin-bottom: 130%!important;}
.mb150_per{margin-bottom: 150%!important;}
.mb155_per{margin-bottom: 155%!important;}
.mb160_per{margin-bottom: 160%!important;}
.mb165_per{margin-bottom: 165%!important;}
.mb180_per{margin-bottom: 180%!important;}
.mb200_per{margin-bottom: 200%!important;}
.mb220_per{margin-bottom: 220%!important;}
.mb280_per{margin-bottom: 280%!important;}
.mb300_per{margin-bottom: 300%!important;}
.mb490_per{margin-bottom: 490%!important;}


/*margin-top 　外側の上方向にスペースを空けたい時に使用*/
.mt20{margin-top: 20px!important;}
.mt25{margin-top: 25px!important;}
.mt35{margin-top: 35px!important;}
.mt50{margin-top: 50px!important;}
.mt60{margin-top: 60px!important;}
.mt70{margin-top: 70px!important;}
.mt80{margin-top: 80px!important;}
.mt90{margin-top: 90px!important;}
.mt140{margin-top: 140px!important;}

/*margin-top 　%調整　外側の上方向にスペースを空けたい時に使用*/
.mt1_per{margin-top: 1%!important;}
.mt2_per{margin-top: 2%!important;}
.mt3_per{margin-top: 3%!important;}
.mt5_per{margin-top: 5%!important;}
.mt6_per{margin-top: 6%!important;}
.mt7_per{margin-top: 7%!important;}
.mt8_per{margin-top: 8%!important;}
.mt9_per{margin-top: 9%!important;}
.mt10_per{margin-top: 10%!important;}
.mt11_per{margin-top: 11%!important;}
.mt12_per{margin-top: 12%!important;}
.mt13_per{margin-top: 13%!important;}
.mt14_per{margin-top: 14%!important;}
.mt15_per{margin-top: 15%!important;}
.mt16_per{margin-top: 16%!important;}
.mt17_per{margin-top: 17%!important;}
.mt18_per{margin-top: 18%!important;}
.mt20_per{margin-top: 20%!important;}
.mt25_per{margin-top: 25%!important;}
.mt35_per{margin-top: 35%!important;}
.mt50_per{margin-top: 50%!important;}
.mt60_per{margin-top: 60%!important;}
.mt70_per{margin-top: 70%!important;}
.mt80_per{margin-top: 80%!important;}
.mt90_per{margin-top: 90%!important;}
.mt140_per{margin-top: 140%!important;}


/*margin-right 　外側の右方向にスペースを空けたい時に使用*/
.mr10{margin-right: 10px!important;}
.mr12{margin-right: 12px!important;}
.mr15{margin-right: 15px!important;}
.mr20{margin-right: 20px!important;}
.mr25{margin-right: 25px!important;}

/*margin-right 　%調整 外側の右方向にスペースを空けたい時に使用*/
.mr4_per{margin-right: 4%!important;}
.mr8_per{margin-right: 8%!important;}

/*margin-left 　外側の右方向にスペースを空けたい時に使用*/
.ml10{margin-left: 10px!important;}
.ml15{margin-left: 15px!important;}
.ml80{margin-left: 80px!important;}

/*padding-top　%調整　内側の上方向にスペースを空けたい時に使用*/
.pt1_per{padding-top: 1%!important;}
.pt2_per{padding-top: 2%!important;}
.pt4_per{padding-top: 4%!important;}
.pt5_per{padding-top: 5%!important;}
.pt6_per{padding-top: 6%!important;}
.pt7_per{padding-top: 7%!important;}
.pt8_per{padding-top: 8%!important;}
.pt9_per{padding-top: 9%!important;}
.pt10_per{padding-top: 10%!important;}
.pt11_per{padding-top: 11%!important;}
.pt12_per{padding-top: 12%!important;}
.pt15_per{padding-top: 15%!important;}
.pt20_per{padding-top: 20%!important;}
.pt21_per{padding-top: 21%!important;}
.pt25_per{padding-top: 25%!important;}
.pt26_per{padding-top: 26%!important;}
.pt30_per{padding-top: 30%!important;}
.pt31_per{padding-top: 31%!important;}

/*padding-bottom　内側の下方向にスペースを空けたい時に使用*/
.pb1_per{padding-bottom: 1%!important;}
.pb3_per{padding-bottom: 3%!important;}
.pb4_per{padding-bottom: 4%!important;}
.pb6_per{padding-bottom: 6%!important;}
.pb9_per{padding-bottom: 9%!important;}
.pb10_per{padding-bottom: 10%!important;}
.pb11_per{padding-bottom: 11%!important;}
.pb15_per{padding-bottom: 15%!important;}
.pb17_per{padding-bottom: 17%!important;}
.pb20_per{padding-bottom: 20%!important;}
.pb30_per{padding-bottom: 30%!important;}

/*margin マイナス*/
.mb-minus10{margin-bottom: -10px!important;}
.mb-minus15{margin-bottom: -15px!important;}
.mb-minus20{margin-bottom: -20px!important;}
.mb-minus25{margin-bottom: -25px!important;}
.mb-minus30{margin-bottom: -30px!important;}
.mb-minus35{margin-bottom: -35px!important;}
.mb-minus40{margin-bottom: -40px!important;}
.mb-minus80{margin-bottom: -80px!important;}
.mb-minus125{margin-bottom: -125px!important;}
.mb-minus150{margin-bottom: -150px!important;}
.mb-minus220{margin-bottom: -220px!important;}

/*margin マイナス%調整*/
.mb-minus1_per{margin-bottom: -1%!important;}
.mb-minus2_per{margin-bottom: -2%!important;}
.mb-minus2-5_per{margin-bottom: -2.5%!important;}
.mb-minus3_per{margin-bottom: -3%!important;}
.mb-minus3-5_per{margin-bottom: -3.5%!important;}
.mb-minus4_per{margin-bottom: -4%!important;}
.mb-minus5_per{margin-bottom: -5%!important;}
.mb-minus7_per{margin-bottom: -7%!important;}
.mb-minus7-5_per{margin-bottom: -7.5%!important;}
.mb-minus9_per{margin-bottom: -9%!important;}
.mb-minus10_per{margin-bottom: -10%!important;}
.mb-minus14_per{margin-bottom: -14%!important;}
.mb-minus15_per{margin-bottom: -15%!important;}
.mb-minus20_per{margin-bottom: -20%!important;}
.mb-minus25_per{margin-bottom: -25%!important;}
.mb-minus30_per{margin-bottom: -30%!important;}
.mb-minus35_per{margin-bottom: -35%!important;}
.mb-minus40_per{margin-bottom: -40%!important;}
.mb-minus45_per{margin-bottom: -45%!important;}
.mb-minus55_per{margin-bottom: -55%!important;}
.mb-minus65_per{margin-bottom: -65%!important;}
.mb-minus80_per{margin-bottom: -80%!important;}
.mb-minus125_per{margin-bottom: -125%!important;}
.mb-minus150_per{margin-bottom: -150%!important;}
.mb-minus220_per{margin-bottom: -220%!important;}

/*margin マイナス%調整*/
.mt-minus1_per{margin-top: -1%!important;}
.mt-minus3_per{margin-top: -3%!important;}
.mt-minus4_per{margin-top: -4%!important;}
.mt-minus5_per{margin-top: -5%!important;}
.mt-minus6_per{margin-top: -6%!important;}
.mt-minus7_per{margin-top: -7%!important;}
.mt-minus8_per{margin-top: -8%!important;}
.mt-minus9_per{margin-top: -9%!important;}
.mt-minus10_per{margin-top: -10%!important;}
.mt-minus11_per{margin-top: -11%!important;}
.mt-minus12_per{margin-top: -12%!important;}
.mt-minus13_per{margin-top: -13%!important;}
.mt-minus14_per{margin-top: -14%!important;}
.mt-minus15_per{margin-top: -15%!important;}
.mt-minus20_per{margin-top: -20%!important;}
.mt-minus23_per{margin-top: -23%!important;}
.mt-minus26_per{margin-top: -26%!important;}
.mt-minus27_per{margin-top: -27%!important;}
.mt-minus28_per{margin-top: -28%!important;}
.mt-minus30_per{margin-top: -30%!important;}
.mt-minus33_per{margin-top: -33%!important;}
.mt-minus50_per{margin-top: -50%!important;}
.mt-minus58_per{margin-top: -58%!important;}
.mt-minus73_per{margin-top: -73%!important;}

/*横幅のサイズ指定*/
.width8{width: 8%!important;}
.width10{width: 10%!important;}
.width15{width: 15%!important;}
.width16{width: 16%!important;}
.width17{width: 17%!important;}
.width18{width: 18%!important;}
.width19{width: 19%!important;}
.width20{width: 20%!important;}
.width21{width: 21%!important;}
.width22{width: 22%!important;}
.width23{width: 23%!important;}
.width24{width: 24%!important;}
.width25{width: 25%!important;}
.width26{width: 26%!important;}
.width27{width: 27%!important;}
.width28{width: 28%!important;}
.width29{width: 29%!important;}
.width30{width: 30%!important;}
.width31{width: 31%!important;}
.width32{width: 32%!important;}
.width33{width: 33%!important;}
.width34{width: 34%!important;}
.width35{width: 35%!important;}
.width36{width: 36%!important;}
.width37{width: 37%!important;}
.width38{width: 38%!important;}
.width39{width: 39%!important;}
.width40{width: 40%!important;}
.width41{width: 41%!important;}
.width42{width: 42%!important;}
.width43{width: 43%!important;}
.width44{width: 44%!important;}
.width45{width: 45%!important;}
.width46{width: 46%!important;}
.width47{width: 47%!important;}
.width48{width: 48%!important;}
.width49{width: 49%!important;}
.width50{width: 50%!important;}
.width51{width: 51%!important;}
.width52{width: 52%!important;}
.width53{width: 53%!important;}
.width54{width: 54%!important;}
.width55{width: 55%!important;}
.width56{width: 56%!important;}
.width57{width: 57%!important;}
.width58{width: 58%!important;}
.width59{width: 59%!important;}
.width60{width: 60%!important;}

.width65{width: 65%!important;}
.width70{width: 70%!important;}
.width75{width: 75%!important;}
.width78{width: 78%!important;}
.width80{width: 80%!important;}
.width81{width: 81%!important;}
.width82{width: 82%!important;}
.width83{width: 83%!important;}
.width84{width: 84%!important;}
.width85{width: 85%!important;}
.width88{width: 88%!important;}
.width90{width: 90%!important;}
.width91{width: 91%!important;}
.width93{width: 93%!important;}
.width95{width: 95%!important;}
.width100{width: 100%!important;}

/*text　テキストの揃え方指定　親要素に入れること*/
.text-left{text-align: left!important;}/*左揃え*/
.text-right{text-align: right!important;}/*右揃え*/
.text-center{text-align: center!important;}/*中央ぞろえ*/

/*img　画像の揃え方　クラス名のみ親要素に入れること(margin_○○ img　←imgは不要)*/
.margin-right img{margin: 0 0 0 auto!important;}
.margin-left img{margin: auto 0 0 0!important;}

/*possition　基準となる位置を決める　親要素に入れること*/
.position-relative{position: relative;}/*従来の位置*/
.position-absolute{position: absolute;}/*親の左上が基準*/

/*flex　横並びに使用　親要素に入れる 子要素はwidthで横幅を決めておくこと*/
.flex{display: flex;}

/*flex使用時のコンテンツの配置　flexと同じく親要素に入れること*/
.justify-sb{justify-content: space-between;}/*左右にわける*/
.justify-sa{justify-content: space-around;}/* 各アイテムを均等に配置し各アイテムの両側に半分の大きさの間隔を置く */
.justify-left{justify-content: left;}/*左配置*/
.justify-flex-end{justify-content: flex-end;}/*要素の終わり*/
.justify-se{justify-content: space-evenly;}/* 各アイテムを均等に配置し各アイテムの周りに同じ大きさの間隔を置く */
.justify-center{justify-content: center;}/*真ん中*/

.items-center{align-items: center;}/*子要素を上下中央で揃える*/
.flex-wrap{flex-wrap: wrap;}/*コンテンツを折り返す*/
.flex-start{align-items: flex-start;}/* 子の上端を揃える */
.flex-end{align-items: flex-end;}/*下揃え*/
.row-reverse{flex-direction: row-reverse;}/*順番入れ替え*/

.flex-shrink{flex-shrink: 0;}/*要素を折り返しさせない*/
.flex-grow{flex-grow:1;}/*高さを揃える※親要素にflex-direction:columnを入れること*/
.flex-direction{flex-direction:column;}/*上から下に垂直方向に並べる*/
.margin-top-auto{margin-top: auto;}/*親要素にflexとflex-direction:column;で下揃え*/

/*aos用*/
.overflow-hidden{overflow: hidden;}

/********************************************************************
	共通
********************************************************************/
html {
  scroll-behavior: smooth; /* スムーススクロール */
}

/*line-heightリセット*/
#cmoatogoke p,#cmoatogoke a,#cmoatogoke ul li,#cmoatogoke h1,#cmoatogoke h2,#cmoatogoke h3,#cmoatogoke h4,#cmoatogoke h5,#cmoatogoke h6,#cmoatogoke h7{
	line-height: 1;
}

/*buttonリセット*/
#cmoatogoke button{padding: 0; background: none; border: none;}

/*ページ全体の指定*/
#cmoatogoke{
	margin: 0 auto;/*中央揃え*/
	max-width: 770px;/*最大横幅*/
	background: transparent;/*背景色*/
	text-align: center;/*テキスト中央揃え*/
	position: relative;
}

/*ページの内側共通*/
#cmoatogoke .wrap{
	margin: 0 auto;/*中央揃え*/
	padding: 20px 0 70px 0;/*要素の上下余白*/
	max-width: 93%;/*最大横幅*/
	box-sizing: border-box;
}

/*ページ内の文章指定*/
#cmoatogoke p{
    text-align: center;/*中央揃え*/
    color: #6b4506;/*文字色*/
	font-family: "メイリオ, Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;/*フォント*/
	font-weight: 700; /* 太字にする */
    font-size: 1.6rem;/*フォントサイズ*/
	letter-spacing: 0em;/*文字間*/
	line-height: 2.2rem;/*行間*/
}
#cmoatogoke img{
	max-width: 100%;
	height: auto;
	margin: 0 auto;
    display: inline-block;
}

#cmoatogoke .img_width100 img{width: 100%;}
#cmoatogoke .img_auto img{width: auto!important;}

/*色*/
#cmoatogoke .orange{color: #f19007!important;}
#cmoatogoke .red{color: #f60e39!important;}
#cmoatogoke .wine-red{color: #c93b66!important;}
#cmoatogoke .blue{color: #0fc3c8!important;}
#cmoatogoke .light-blue{color: #0fc3c8!important;}
#cmoatogoke .green{color: #00a1be!important;}
#cmoatogoke .pink{color: #ee008c!important;}
#cmoatogoke .white{color: #fff!important;}
#cmoatogoke .black{color: #00000a!important;}

/*太字*/
#cmoatogoke .bold{font-weight: bold;}

/*リスト*/
#cmoatogoke ul{
	list-style: none;
}
#cmoatogoke ul li{
	color: #24281f;
	text-align: center;/*中央揃え*/
    font-size: 1.8rem;/*フォントサイズ*/
	letter-spacing:  0em;/*文字間*/
	line-height: 2.8rem;/*行間*/
}


/* 子要素と子要素の間に16pxの隙間ができる（親要素に入れる。） */
.gap4_per{gap: 4%;}


/********************************************************************
	追加共通
********************************************************************/
.align-self-flex-end{align-self: flex-end;}/*下揃え　親要素がflex*/

.scroll-target {
  scroll-margin-top: 80px; /* ジャンプした先のセクション上に必要な余白を指定 */
}

/********************************************************************
	共通
********************************************************************/
  /* ベージュ背景　1番下*/
#cmoatogoke .bg_00{
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_00.png) repeat;
	background-size: 100%;
	position: relative;
	z-index: 5;
	padding: 0 0 4% 0;
}

/* セクションタイトル */
#cmoatogoke .sec_title{
	position: relative;
	z-index: 200;
}


/*-----追従ボタン------*/

#cmoatogoke  .float {
    direction: rtl;
}
#cmoatogoke  .floating {
	position: fixed;
	bottom: 0;
	display: none;
	z-index: 9999;
}
#cmoatogoke  .floating a {
	display: block;
	padding: 8px;
	text-decoration: none;
}
#cmoatogoke  .floating a:hover {
	opacity: 1;
}

/**************************************************************
	キャンペーン期間
********************************************************************/
#cmoatogoke .camTerm {
	background-color: #c70010;
	color: #FFFFFF; /* 文字色指定 */
	font-family: "メイリオ, Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;/*フォント*/
	letter-spacing: 0.1em; /* 文字間*/
	margin-top: -1.2%;
}


/********************************************************************
	最新巻情報
********************************************************************/
  /* 背景*/
#cmoatogoke .bg_decoration_01{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_decoration_01.png) no-repeat;
	background-size: 100%;
	background-position: center -20px;
	z-index: 20;
}

#cmoatogoke #new .flame_0-1{
	background: url(/auto/images/fix/title/cmoatogoke/pcc/decoration/flame_0-1.png) no-repeat;
	background-size: 96%;
	background-position: 58% center; 
	padding: 1% 0 4% 0;
}

/* コミックの横幅調整 */
#cmoatogoke .comic_wrap{
	width:82%;
    margin-left: auto;
	margin-right: auto;
	position: relative;
	left: 1%; /* 中央から右に5%ずらす */
}

/* 作品の横並び */
#cmoatogoke #new .comic_container_right,#cmoatogoke #new .comic_container_left{
	 flex: 1;
}

#cmoatogoke #new .comic_container_right img,#cmoatogoke #new .comic_container_left img{
	display:block;
}

#cmoatogoke #new .comic_container_right{
	display: flex;
	margin-left: auto;
    margin-right: auto;
    position: relative;
    left: 2%;
  	flex-direction: column;
  	justify-content: center; /* 中身を上下中央揃えに */
}

#cmoatogoke #new .inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* 3つの画像を上下端に均等配置 */
  height: 100%; /* 親の高さ（contentsB）に合わせる */
}

#cmoatogoke #new .decoration_shoei{
	box-sizing: border-box;
	border: 1px solid #23919a;
	box-shadow: 7px 7px 0 0 #23919a;
	z-index: 90;
}

/********************************************************************
	ストーリー
********************************************************************/
/* ブルー背景 11/1用 */
#cmoatogoke #story .bg_02_blue_01{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_02_blue_01.png) no-repeat;
	background-size: 100%;
	padding: 0 0 3% 0;
	z-index: 40;
}

/* ブルー背景 11/2以降 */
#cmoatogoke #story .bg_02_blue{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_02_blue.png) no-repeat;
	background-size: 100%;
	padding: 0 0 3% 0;
	z-index: 40;
}

/* コマの最大横幅 */
#cmoatogoke .koma_wrap{
	width: 95.5%;
	margin:0 auto;
}


#cmoatogoke #story .koma_1-3,#cmoatogoke #story .koma_3-3{
	text-align: right;
}

#cmoatogoke #story .koma_1-4,#cmoatogoke #story .koma_3-6,#cmoatogoke #story .copy_4-1{
	text-align: left;
}



/*　ホワイト背景 */
#cmoatogoke #story .bg_03_white{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_03_white.png) repeat;
	background-size: 100%;
	overflow: hidden;
	padding:0 0 2% 0;
	z-index: 50;;
}

/*　ホワイト背景の柄 */
#cmoatogoke #story .bg_decoration_03{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_decoration_03.png) no-repeat;
	background-size: 100%;
	padding:0 0 2% 0;
	z-index: 60;
}

/*　ブラック背景 */
#cmoatogoke #story .bg_04_black{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_04_black.png) no-repeat;
	background-size: 100%;
	padding:0 0 10% 0;
	z-index: 50;;
}

#cmoatogoke #story .koma_3-4{
	position:absolute;
	top: 4%;
	left: 2%;
}

#cmoatogoke #story .koma_3-5{
	position:absolute;
	top: 30%;
	right: 2%;
}


#cmoatogoke #story .copy_4-2{
	position:absolute;
	bottom: 2%;
    right: 21.2%;
}

#cmoatogoke #story .copy_4-3{
	position:absolute;
	top: 2%;
    left: 19.8%;
}

#cmoatogoke #story .copy_4-4{
	position:absolute;
	bottom: 5%;
    right: 5.2%;
}


/*　ブルー背景02 */
#cmoatogoke #story .bg_02_blue_02{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_02_blue_02.png) no-repeat;
	background-size: 100%;
	padding:10% 0 260% 0;
	z-index: 40;
}

#cmoatogoke #story .koma_4-4{
	position: relative;
	margin-top: -267%;
	z-index: 70;
}

/*　ホワイト背景02 */
#cmoatogoke #story .bg_03_white_02{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_03_white_02.png) repeat;
	background-size: 100%;
	overflow: hidden;
	padding:0 0 10% 0;
	z-index: 50;;
}

/*　ホワイト背景の柄02 */
#cmoatogoke #story .bg_decoration_04{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_decoration_04.png) no-repeat;
	background-size: 100%;
	padding:0 0 2% 0;
	z-index: 60;
}

/********************************************************************
	キャラクター
********************************************************************/

/*　ディープブルー背景 */
#cmoatogoke #character .bg_05_deepblue{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_05_deepblue.png) no-repeat;
	background-size: 100%;
	padding:0 0 12% 0;
	z-index: 70;
}

#cmoatogoke #character .character_box{
	width:100%;
    margin-left: auto;
	margin-right: auto;
	position: relative;
	left: 0.5%; /* 中央から右に5%ずらす */
}


/********************************************************************
	ストーリー２
********************************************************************/
/*　ブラック背景 */
#cmoatogoke #story_02 .bg_06_black{
	position: relative;
	background-color: #000000;
	background-size: 100%;
	padding: 0 0 8% 0;
	z-index: 30;
}

/*　ホワイト背景 */
#cmoatogoke #story_02 .bg_07_white{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_07_white.png) no-repeat;
	background-size: 100%;
	padding: 0 0 9% 0;
	z-index: 40;
}


#cmoatogoke #story_02 .koma_6-3{
	position:absolute;
	top: 12%;
	left: 0;
	z-index: 70;
}

/********************************************************************
	おまけ
********************************************************************/

/*　ディープブルー背景 */
#cmoatogoke #omake .bg_08_deepblue{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_08_deepblue.png) no-repeat;
	background-size: 100%;
	padding: 0 0 5% 0;
	z-index: 30;
}


#cmoatogoke #omake .inner_02 {
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* 3つの画像を上下端に均等配置 */
  height: 100%; /* 親の高さ（contentsB）に合わせる */
}

#cmoatogoke #omake .omake_box{
	width: 95.5%;
    margin-left: auto;
	margin-right: auto;
	position: relative;
	left: 0.5%; /* 中央から右に5%ずらす */
}


/********************************************************************
	コミック
********************************************************************/
  /* 背景*/
#cmoatogoke #comic .bg_decoration_05{
	position: relative;
	background: url(/auto/images/fix/title/cmoatogoke/pcc/background/bg_decoration_05.png) no-repeat;
	background-size: 100%;
	background-position: center -20px;
	z-index: 20;
}

#cmoatogoke #comic .flame_1{
	background-color: #FFFFFF;
	background-size: 96%;
	border: 8px solid #128992;
	box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.3);
	padding: 1% 0 4% 0;
}

#cmoatogoke #comic .flame_1::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  right: 4px;
  bottom: 4px;
  border: 3px solid #dfb45d;
  pointer-events: none;
}

/* コミックの横幅調整 */
#cmoatogoke #comic .comic_wrap_01{
	width:92%;
    margin-left: auto;
	margin-right: auto;
	position: relative;
	left: 0.3%; /* 中央から右に5%ずらす */
}


/* コミックの横幅調整 */
#cmoatogoke #comic .comic_wrap_02{
	width:95%;
    margin-left: auto;
	margin-right: auto;
	position: relative;
	left: 0.3%; /* 中央から右に5%ずらす */
}

/* 作品の横並び */
#cmoatogoke #comic .comic_container_right,#cmoatogoke #comic .comic_container_left{
	 flex: 1;
}

#cmoatogoke #comic .comic_container_right img,#cmoatogoke #comic .comic_container_left img{
	display:block;
}

#cmoatogoke #comic .comic_container_right{
	display: flex;
	margin-left: auto;
    margin-right: auto;
    position: relative;
    left: 2%;
  	flex-direction: column;
  	justify-content: center; /* 中身を上下中央揃えに */
}

#cmoatogoke #comic .inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* 3つの画像を上下端に均等配置 */
  height: 100%; /* 親の高さ（contentsB）に合わせる */
}

#cmoatogoke #comic .decoration_shoei{
	box-sizing: border-box;
	border: 1px solid #23919a;
	box-shadow: 7px 7px 0 0 #23919a;
	z-index: 90;
}


/********************************************************************
	上部クーポンarea非表示
********************************************************************/
.contents_right .couponArea2022{display: none;}