@charset "utf-8";
/* CSS Document */

body {
  margin:0;
  color:#3e3a39;
  background-color: #fff;
  font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI","Noto Sans Japanese","Meiryo","ヒラギノ角ゴ ProN W3", sans-serif;
}

.common {
 width: 1000px;
 margin: 0 auto;
 background-color: #fff;
 border: 0;
 margin: 0 auto;
}

.header {
  background-image: url(img/header.jpg);
  height:40px;
  position: relative;
}
.header_mond{
  float: left;
  position: absolute;
}

h1{ 
  margin:0;
  font-size: 20px; 
  color:#fff;
  text-align:center;
  padding: 5px 0 0 120px;
  float: left;
}

.concept{
  font-family: serif;
  font-size: 40px;
  text-align: center;
  padding: 70px;
}
.consept_sub{
  font-family: serif;
  background: #f9f9f9;
  font-size: 24px;
  padding: 3%;
  text-align: center;
}

.alpha a:hover img {
  opacity: 0.9;
  filter: alpha(opacity=95);
  -ms-filter: "alpha(opacity=95)";
}

.purchase{
  position: relative;
}
.btn_3set{
  position: absolute;
  top: 53%;
  left: 15%;
  width: 70%;
}
.btn_1set{
  position: absolute;
  top: 73%;
  left: 15%;
  width: 70%;
}
.btn_trial{
  position: absolute;
  top: 42%;
  left: 77%;
  width: 30%;
}

.content img{
  vertical-align: bottom;
}

.page-back {
 width: 100px;
 position: fixed;
 bottom: 10px;
 right: 10px;
 border: 0;
}



.cart-info {
    position: relative;
    max-width: 900px;
    height: 860px;
    margin: 0 auto 30%;
    text-align: left;
    display: block;
    clear: both;
}
.cart-info-box {
    width: 45%;
    display: inline-block;
    float: left;
    padding: 0 10px 0 17px;
}
.cart-info-title {
    border-top: 2px dotted #ff93b4;
    border-bottom: 2px dotted #ff93b4;
    padding: 5px 2px;
}
.cart-info-box a {
    color: #FF637D;
    text-decoration: none;
}
.cart-info-box a:hover {
    color: #d2a1aa;
} /*カーソルが乗っているリンクの色*/

h2, .h2 {
    font-size: 18px;
}
h2, .h2 {
    margin-top: 10px;
    margin-bottom: 10px;
}
p.cart-red-color {
    color: red;
    font-weight: 600;
    font-size: 18px;
}
.cart-info-title {
    border-top: 2px dotted #ff93b4;
    border-bottom: 2px dotted #ff93b4;
    padding: 5px 2px;
}
img {
    height: auto;
    max-width: 100%;
}

ul a{ 
    color: #FF637D;
    font-size: 15px;
    text-decoration: none;
}

ul a:hover{ 
    color: #d2a1aa;
}

.footer {
    background-color: #000;
    width: 100%;
    padding: 30px 0;
    text-align: center;
    color: #fff;
}

.product_name{
    color: #FF637D;
    text-align: center;
    font-size: 30px;
    line-height: 70px;
    text-decoration: none;
}

.footer a:hover{ 
    color: #d2a1aa;
}

.footer li {
    width: 20%;
    display: inline-block;
    text-align: center;
    line-height: 50px;
}



/*===============================================
●tablet.css  画面の横幅が600pxまで
===============================================*/
    

@media screen and (max-width:600px){

body {
width: 100%;
}
  
img{
text-align: center;
display: block;
  }

.common{
min-width: 400px;
text-align: center;
padding: 0;
overflow: hidden;
width:100%;
  }
  
h1{
font-size: 1.2em;
padding-left: 90px;
}

.header_mond{
width: 90px;  
}
  
.concept{
  font-size: 4.2vw;
  padding: 5px;
}
.consept_sub{
  font-size: 3vw;
  padding: 5px;
}
.btn_3set{
  top: 68%;
  left: 5%;
  width: 89%;
}
.btn_1set{
  top: 81%;
  left: 5%;
  width: 89%;
}
.btn_trial{
  top: 52%;
  left: 16%;
  width: 78%;
}

.page-back {
 width: 100px;
 position: fixed;
 bottom: 50px;
 right: 10px;
 border: 0;
}
  

.cart-info-box {
    width: 92%;
    display: inline-block;
    float: none;
    clear: both;
    padding: 0 20px;
}
.cart-info-box img {
    margin: 5% auto;
}

.cart-info {
    margin-bottom: 20px!important;
}
  
ul a{ 
    color: #FF637D;
    font-size: 15px;
    text-decoration: none;
}

ul a:hover{ 
    color: #d2a1aa;
}

.footer {
    margin-top: 1450px; 
    background-color: #000;
    width: 100%;
    padding: 30px;
    text-align: left;
    color: #fff;
}

.product_name{
    color: #FF637D;
    font-size: 30px;
    line-height: 80px;
}
  
.footer li {
    width: 100%;
    line-height: 20px;
    text-align: left;
}
.footer p {
    text-align: left;
}  
  
  
}

@media screen and (min-width:600px){
.sp { display: none!important;}
}

@media screen and (max-width:600px){
.pc { display: none;}
}

@media print{
  .sp { display: none;}
}