.all_box {
  display: flex;
}

.half_box {
  display: block;
  width: 50%;
}

.left_side {
  display: block;
  position: fixed;
	height: 100%;
}

.left_side img{
	position: absolute;
}
.chara{
	margin-left: 15px;
	margin-top: -5%;
	min-width:85%;
	max-width:540px;	
	top: 50%;
  	left: 50%;
	 transform: translate(-50%,-50%);
}
.bg{
	width: 100%;
	height:100%;
	transform: translate(0%,0%);
}
.logo{
}
.logoimg{
	width: 100%;
	bottom: 10%;
    left: 50%;
	 transform: translate(-50%,40%);
}
.logo_txt{
		max-width: 400px;
		min-width: 50%;
	margin-top: 1%;
    left: 60%;
	 transform: translate(-50%,0%);
}
.sale_txt{
	width: 50%;
	bottom: 20%;
    left: 50%;
	 transform: translate(-50%,0%);
}
.icon_div{
	position: relative;
	
}
.icon{
	margin-top:57px;
	
}
.icon_kobetu{
	width: 57px;
	margin-top:-50px;
}
li{
	 list-style: none;
	margin: 10px 0px;
}
.platt_icon{
	 display: flex;
	flex-direction: column;
}


.logo2{
	width: 100%;
	bottom: 10%;
    left: 50%;
	 transform: translate(-50%,40%);
}

.left_side_text {
  padding-top: 0px;
}
.left_side_text p {
  font-size: 24px;
  line-height: 2;
  padding: 1em 0;
  color: #FFFFFF;
  text-align: center;
}


.left_side_text p span {
  background: linear-gradient(transparent 70%, red 100%);
  padding: 0.5em;
}
.right_side_color1{
		 background-color:#383e7f;
	position: relative;
}
.right_side_color2{
    background: 
	linear-gradient(0deg, #383e7f 5%, rgba(30,50,115,1) 10%,rgba(30,50,115,1) 95%, #383e7f 100%);
    width: 100%;
    height: 100%;
	position: relative;
}

.right_side_color3{
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-mask-image: linear-gradient(180deg, white 40%,red 0%, transparent);
    mask-image: linear-gradient(to top, transparent, black 3em, black calc(100% - 3em), transparent);
	mix-blend-mode: color-dodge;
}
.mask_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
	opacity: 0.1;
	
	filter: blur(2px);
  }

.right_side {
  margin-left: 50%;
  position: absolute;
	 background-color:#FFF;
}
.right_side_image {
  width: 100%;
  margin: 8px auto;
}
.right_side_image img {
  width: 100%;
	
}
.right_side_text {
	
  padding: 6% 7%;

}
.right_side_text p {
  text-align: center;
}

section{
	margin-left: auto;
    margin-right: auto;
	text-align: center;
    
}


section:nth-of-type(2n)
{
background:#eee;
}
p
{

	font-size: 20px;
}

p.fontsize100{
	 font-family: 'Noto Serif JP', serif;
	font-size: 1.5rem;
	font-weight : 500;
	  background: -webkit-linear-gradient(90deg, white, #a7f6ff); /* 背景色にグラデーションを指定 */
  color: white; /* 非対応のブラウザの為に色を設定 */
  -webkit-background-clip: text; /* テキストで切り抜く */
  -webkit-text-fill-color: transparent; /* 切り抜いた部分は背景を表示 */
}
p.fontsize97{
	 font-family: 'Noto Serif JP', serif;
	font-size: 1.3rem;
	font-weight : 500;
	  background: -webkit-linear-gradient(90deg, white, #a7f6ff); /* 背景色にグラデーションを指定 */
  color: white; /* 非対応のブラウザの為に色を設定 */
  -webkit-background-clip: text; /* テキストで切り抜く */
  -webkit-text-fill-color: transparent; /* 切り抜いた部分は背景を表示 */
}
p.fontsize5{
    font-family: 'M PLUS 1p', sans-serif;
	
	font-size: 1.15rem;
	font-weight : 400;
	color:#eee;
}
p.fontsize6{
	font-size: 1.2rem;
	color:#4a8ec4;
}

/*タブ系*/
.tab-wrap {
  display: flex;
  flex-wrap: wrap;
  margin:20px 0;
}
.tab-wrap:after {
  content: '';
  width: 100%;
  height: 3px;
  background: #87b5d9;
  display: block;
  order: -1;
}
.tab-label {
  color: White;
  background: LightGray;
  font-weight: bold;
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
  white-space: nowrap;
  text-align: center;
  padding: 10px .5em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
  flex: 1;
}
.tab-label:not(:last-of-type) {
  margin-right: 5px;
}
.tab-content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
	 background: #eee;
}
/* アクティブなタブ */
.tab-switch:checked+.tab-label {
  background: #87b5d9;
}
.tab-switch:checked+.tab-label+.tab-content {
  height: auto;
  overflow: auto;
  padding: 15px;
  opacity: 1;
  transition: .5s opacity;
  box-shadow: 0 0 3px rgba(0,0,0,.2);
	height: 400px;
}
/* ラジオボタン非表示 */
.tab-switch {
  display: none;
}


.border-gradation {
   border-bottom: 4px solid;
   border-image: linear-gradient(to right, #00ffd500 0%,#00ffd5 50%, #0f3dd700 100%);
  border-image-slice: 1; 
  margin-bottom: 30px;
}


.blend {
    background:linear-gradient(0deg, #383e7f 5%, rgba(30,50,115,1) 10%,rgba(30,50,115,1) 95%, #383e7f 100%) url("../img/cap/cap_001.png") no-repeat;
    background-blend-mode:multiply;
	width:100%; 
}

.platt_icon2{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 100%;
    margin: 30px 0;
    padding-top: 20px;
}
.platt_icon3{
    display: flex;
    flex-wrap: wrap;
     list-style: none;
}
.icon3{
	max-width:100%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	
}
.platt_icon3 li {
	width: calc(100%/4);/*←画像を横に4つ並べる場合*/
	padding:0 5px;/*←画像の左右に5pxの余白を入れる場合*/
	box-sizing:border-box;
}

.row{
		display:table-row;
	}	
.platt_icon4 .cell {
display:table-cell;
	padding:10px;
}

.platt_icon4 {
  display: table;
	  margin-right: auto;
  margin-left: auto;
/*  list-style: none;
	vertical-align: middle;
	width:90%;/*←画像を横に4つ並べる場合*/
/*	margin :1% 5%; /*画像のはみだしを防ぐ*/
	
}
.icon4{
	/*
	margin :1% 5%; /*画像のはみだしを防ぐ*/
/*	height: auto; /*画像の縦横比を維持 */
/*	width:40%;/*←画像を横に4つ並べる場合*/
	
}
table {
  border-collapse: collapse;
	width:100%
}
table th, table td {
  border: dashed 1px  #ddd;/**/
	width:10%;
  /*破線 1px オレンジ*/
		font-size: 1.0em;
	color:#4a8ec4;
	line-height: 1.7;
}
/*余白と文字装飾は省略*/

.epi{
	margin-top:-10%;
}

@media screen and (max-width:640px){
	.all_box {
		  display: block;
		  margin-top: 0px;
		  padding-top: 0px;
	}
	.half_box {
	  width: 100%;
	}
	.left_side {
	position:relative!important;
	height: 0%;
	}
	

	.left_side img{
	width: 100%;
	margin-top:0px;
}
	.chara{
	top:0%;
	 left: 0%;
	margin-left: 0px;
	min-width:100%;
	max-width:100%;
	height:auto;
	transform: translate(0%,-100%);
}
	.logo{
		
}
	.logoimg{
	width: 100%;
	bottom: 50%;
    left: 0%;
	 transform: translate(0%,0%);
}
	.logo_txt{
		max-width: 80%;
		min-width: 80%;
	margin-top: 1%;
    left: 20%;
	 transform: translate(0%,-600%);
}
.sale_txt{
	width: 0%;
	bottom: 0%;
    left: 0%;
	 transform: translate(0%,-200%);
}
	.bg{
	width: 100%;
	bottom: 0%;
    left: 0%;
	height:auto;
	transform: translate(0%,0%);
}
	.right_side {
	margin-left: 0%;
	margin-top: 140%;
	position: relative;
   background-color: #AAA;
	}
	.icon{
	display:none;
		
}
.icon_kobetu{
	display:none;
	
}
.platt_icon{
	 display: none;
}
}