
@media screen and (min-width: 768px) {
	#contentWrap { text-align: center; background-color: #fff; padding-bottom: 40px; }
	#mainvisual { background: #00a0e9; }
	/*#mainvisual2 { background: #e7007b; margin-top: 12px; }*/
	#mainvisualInner, #mainvisualInner2 { max-width: 980px; margin: 0 auto; text-align: left; position: relative; } 
	#mainvisualInner img, #mainvisualInner2 img { max-width: 980px; width: 100%; } 
	
	#c01 { max-width: 900px; margin: 0 auto;}
	
	.plan-box { margin-bottom: 50px; padding: 40px 11.4% 30px; border: 2px solid #8cd0f2; background: #fff; position: relative; }
	.plan-box-blue { border: 2px solid #00a0e9; background: #00a0e9; }
	.plan-box-org { border: 2px solid #e9561e; background: #e9561e; }
	.plan-box-red { border: 2px solid #e4007f; background: #e4007f; }
	
	.plan-box .plan-catch { color:#323232; font-weight: bold; font-size: 21px; display: inline-block; position: relative; margin-bottom: 10px; }
	.plan-box .plan-catch span { font-size: 12px; }
	.plan-box .plan-catch::before { content: '\FF5C'; transform: rotate(-30deg) scale(1,1.5); display: inline-block; font-weight: normal; }
	.plan-box .plan-catch::after { content: '\FF5C'; transform: rotate(30deg) scale(1,1.5); display: inline-block; font-weight: normal; }
	.plan-box img.badge { position: absolute; left: -5%; top: 0; margin-top: -4%; }
	
	.plan-content-box {  }
	.plan-name-box { border-bottom: 2px solid #999; margin-bottom: 25px; padding-bottom: 20px; }
	.plan-name-box h2 img,
	.plan-name-box p img { width: 100%; max-width: 690px;  }
	.plan-box-blue .plan-name-box,
	.plan-box-org .plan-name-box,
	.plan-box-red .plan-name-box {border-bottom: 2px solid #fff; }
	
	.plan-name-box p { font-size: 19px; color: #1aa1e6; }
	.plan-box-blue p,
	.plan-box-org p,
	.plan-box-red p,
	.plan-box-blue ul li,
	.plan-box-org ul li,
	.plan-box-red ul li, 
	.plan-box-blue ul li a,
	.plan-box-org ul li a,
	.plan-box-red ul li a{ color: #fff!important; }
	
	
	.charge-catch-L { font-size: 31px; font-weight: bold;}
	.plan-period { font-size: 16px;}
	.plan-box-org .charge-note-badge { position: absolute; width: 21.653%; right: 2.4%; top: 1%; margin-top: 9%; }
	.plan-box-red .charge-note-badge { position: absolute; width: 14.2%; right: 10%; top: 0; margin-top: 13.4%; }
	.charge-note-badge img { width: 100%;}
	
	.plan-note-box { text-align: center; font-size: 14px; }
	.plan-note-box ul { text-align: left; display: inline-block; }
	.plan-note-box ul li { /*padding-left: 1.1em; text-indent: -1.1em;*/ }
	.plan-note-box ul li:last-child { padding-top: 10px; }
	.plan-note-box ul li a { display: inline!important; }
	
	
	
	#c02 h2 { font-size: 22px; margin-bottom: 30px; }
	#c02 .view-pc p { border: 2px solid #1793d3; color: #1793d3; font-weight: bold; font-size: 22px; padding: 20px 0; display: block; max-width: 480px; margin: 0 auto 30px; }
	#c02 .view-pc p span { display: inline-block; transform: rotate(-90deg);}
	#c02 .view-pc p img { margin-left: 40px; }
	
	#c01 a.outer {
    	background: url(https://www.au.com/content/dam/au-com/mobile/charge/smartphone/images/newplan2019/icon_outer_white.png) no-repeat right center;
    	background-size: 10px;
    	padding-right: 14px!important;
		text-decoration: underline;
	}

	#c01 a.outer2 {
    	background: url(https://www.au.com/content/dam/au-com/mobile/charge/smartphone/images/newplan2019/icon_outer_white.png) no-repeat right center;
    	background-size: 10px;
    	padding-right: 14px!important;
	}

	#c01 a.outer.bl {
    	background: url(https://www.au.com/content/dam/au-com/mobile/charge/smartphone/images/newplan2019/icon_outer_orange.png) no-repeat right center;
    	background-size: 10px;
    	padding-right: 14px!important;
		text-decoration: underline;
	}
	
	#c02 a.outer {
    	background: url(https://www.au.com/content/dam/au-com/mobile/charge/smartphone/images/newplan2019/icon_outer_orange.png) no-repeat right center;
    	background-size: 10px;
    	padding-right: 14px!important;
	}
}

@media screen and (min-width: 1200px) {}
@media screen and (max-width: 1199px) and (min-width: 980px) {}

/* tablet */
@media screen and (max-width: 979px) and (min-width: 768px) {
	
	.plan-box img.badge { position: absolute; left: -2%; top: 0; margin-top: -3%; width: 15%; }
	.plan-box .plan-catch { font-size: 2.3vw; }
	.plan-name-box p{ font-size: 2vw; }
}

/* smart phone */
@media screen and (max-width: 767px) and (min-width: 0px) {
	#contentWrap {  text-align: center; background-color: #fff; padding-bottom: 0px; }
	#mainvisual { background: #00a0e9; }
	/*#mainvisual2 {}*/
	#mainvisual { background-size: 100% auto; position: relative; }
	#hero-catch img { width: 100%; }
	
	#c01 { padding: 0 6%; }
	#c02 { padding: 0 6% 6%; }
	
	
	.plan-box { margin-bottom: 10%; padding: 11% 5%; border: 2px solid #8cd0f2; background: #fff; position: relative; }
	.plan-box-blue { border: 2px solid #00a0e9; background: #00a0e9; }
	.plan-box-org { border: 2px solid #e9561e; background: #e9561e; }
	.plan-box-red { border: 2px solid #e4007f; background: #e4007f; }
	
	.plan-box .plan-catch { color:#323232; font-weight: bold; font-size: 3.4vw; display: inline-block; position: relative; }
	.plan-box .plan-catch span { font-size: 2.6vw; }
	.plan-box .plan-catch::before { content: '\FF5C'; transform: rotate(-30deg) scale(1,1.5); display: inline-block; font-weight: normal; vertical-align: bottom; }
	.plan-box .plan-catch::after { content: '\FF5C'; transform: rotate(30deg) scale(1,1.5); display: inline-block; font-weight: normal; vertical-align: bottom; }
	.plan-box:nth-child(1) .plan-catch::before { position: absolute; bottom: 0; left:-8%; }
	.plan-box:nth-child(1) .plan-catch::after { position: absolute; bottom: 0; right:-8%; }
	.plan-box:nth-child(2) .plan-catch::before { position: absolute; bottom: 0; left:-8%; }
	.plan-box:nth-child(2) .plan-catch::after { position: absolute; bottom: 0; right:-8%; }
	.plan-box:nth-child(5) .plan-catch::before { position: absolute; bottom: 0; left:-8%; }
	.plan-box:nth-child(5) .plan-catch::after { position: absolute; bottom: 0; right:-8%; }
	
	.plan-box img.badge { position: absolute; left: -6%; top: 0; margin-top: -9%; width: 24%; }
	
	.plan-content-box {  }
	.plan-name-box { border-bottom: 1px solid #999; margin-bottom: 5%; padding-bottom: 6%; }
	.plan-name-box h2 img,
	.plan-name-box p img { width: 100%;  }
	.plan-box-blue .plan-name-box,
	.plan-box-org .plan-name-box,
	.plan-box-red .plan-name-box {border-bottom: 1px solid #fff; }
	
	.plan-name-box p { font-size: 3.1vw; color: #1aa1e6; }
	.plan-box-blue p,
	.plan-box-org p,
	.plan-box-red p,
	.plan-box-blue ul li,
	.plan-box-org ul li,
	.plan-box-red ul li,
	.plan-box-blue ul li a,
	.plan-box-org ul li a,
	.plan-box-red ul li a{ color: #fff!important; }
	
	.charge-catch-L { font-size: 5vw; font-weight: bold;}
	.plan-period { font-size: 2.5vw;}
	
	.charge-note-badge img { width: 100%;}
	
	.plan-note-box { text-align: center; font-size: 2.8vw; }
	.plan-note-box ul { text-align: left; display: inline-block; }
	.plan-note-box ul li:last-child { padding-top: 1vw; }
	.plan-note-box ul li a { display: inline!important; }
	
	#c02 h2 { font-size:4vw; margin-bottom: 6%; }
	#c02 a { font-size: 3.4vw; }
	#c02 .view-sp a { background: #1793d3; color: #fff; font-weight: bold; font-size: 4.6vw; height: 14vw; line-height: 14vw; display: block; margin-bottom: 6%; }
	
	#c01 a.outer {
    	background: url(https://www.au.com/content/dam/au-com/mobile/charge/smartphone/images/newplan2019/icon_outer_white.png) no-repeat right center;
    	background-size: 2vw;
    	padding-right: 2.4vw!important;
		text-decoration: underline;
	}
	#c01 a.outer2 {
    	background: url(https://www.au.com/content/dam/au-com/mobile/charge/smartphone/images/newplan2019/icon_outer_white.png) no-repeat right center;
    	background-size: 10px;
    	padding-right: 14px!important;
	}
	#c01 a.outer.bl {
    	background: url(https://www.au.com/content/dam/au-com/mobile/charge/smartphone/images/newplan2019/icon_outer_orange.png) no-repeat right center;
    	background-size: 2vw;
    	padding-right: 2.4vw!important;
		text-decoration: underline;
	}
	#c02 a.outer {
    	background: url(https://www.au.com/content/dam/au-com/mobile/charge/smartphone/images/newplan2019/icon_outer_orange.png) no-repeat right center;
    	background-size: 2vw;
    	padding-right: 2.4vw!important;
	}
	
	#c02 .view-sp a::after {
		display: block;
		content: '';
		position: absolute;
		top: 40%;
		right: 3vw;
		background: url(https://www.au.com/content/dam/au-com/mobile/charge/smartphone/images/newplan2019/icon_outer_white.png) no-repeat center center;
		background-size: 3vw;
		width: 3vw;
		height: 3vw;
	}
}

.view-sp { display: none; }
.view-pc { display: block; }

@media screen and (min-width: 0px) and (max-width: 767px) {
	
	.view-sp { display: block; }
	.view-pc { display: none; }

}

.plan-box {
	opacity:0;
    transform: translateY(50px);
	-webkit-transform : translateY(50px);
	transition: all 0.4s linear;
	-webkit-transition: all 0.4s linear;
}




.fwB { font-weight: bold;}
.ylw { color: #fff600!important;}
.orange { color: #eb5505!important; }
.red { color: #FF0000!important; }
.alert { color: #FF0000!important; font-weight: bold; }
.taC { text-align: center!important; }




@media screen and (min-width: 768px) {
	.marginforbadge {
		margin-bottom: 6%;
	}
}
@media screen and (max-width: 767px) and (min-width: 0px) {
	.marginforbadge {
		margin-bottom: 11%;
	}
}