@charset "utf-8";
/* CSS Document */

html,body{
 *overflow-x: hidden;
 *background-color:#00fa9a;
}

a{
 color: #409ecc!important;
}

#wrapper{
 background-color:#f8f4e6;
  border-bottom: solid 1px #32cd32;
 *margin-bottom: 10px;
 *min-height: 100vh;
 *background-image:url(../images/.jpg); 
 *background-repeat:no-repeat;
 *background-size:cover;
 *background-position: 50% 50%;
 *position: relative;
 *text-align: center;
}

.main_title{
 *max-width:100vw;
 background-color:#00a968;
 color: #fff;
 font-size: 42px;
 padding: 30px 0;
 margin: 0 auto;
 text-align: center;
box-shadow:5px 3px 5px 5px rgba(0, 0, 0, 0.1);
}

.new{
 max-width: 1300px;
 border: 2px solid #ea5550;
 border-radius: 5px;
 margin: 40px auto 0;
}

.new_title{
 max-width:1300px;
 *background-color:#ea5550;
 color: #ea5550;
 border-bottom: dashed 3px #ea5550;
 font-size: 23px;
 padding: 10px 0px 10px 10px;
 margin: 5px auto;
}

.new_wrap{
 max-width:1300px;
 max-height: 250px;
 padding: 10px 10px 10px 10px;
 margin: 0 auto;
 overflow: auto;
 font-weight: bold;
 font-size: 16px;
}

dl{
 margin: 5px auto!important;
}

dt{
 display: inline-block;
 color:#c70067;
}

dd{
 display: inline-block;
}

.title_jumper{
 max-width: 1060px;
 margin: 50px auto;
 *text-align: center;

}

.title_jumper li{
 display: inline-block;
 background-color: #00a968;
 padding: 10px 40px;
 margin: 10px 15px;
 font-size: 20px;
 color: #fff;
 border-radius: 3px;
  box-shadow: 0px 0px 0px 5px #00a968;
  border: dashed 1px #fff;
}

.title_another li{
 background-color: #ff8c00;
  box-shadow: 0px 0px 0px 5px #ff8c00;
}

.title_jumper div{
 width: 200px;
 background-color: #00a968;
 padding: 10px 40px;
 margin: 10px 11% 10px 11%;
 font-size: 20px;
 color: #fff;
 border-radius: 3px;
}

.title_infotext{
 max-width: 1300px;
 font-size: 32px;
 margin: 20px auto;
 color:#2e8b57;
}

.title_line{
 max-width: 1300px;
 font-size: 24px;
 padding: 10px 0px 10px 10px;
 margin: 0px auto;
 background-color: #00a968;
 color:#fff;
  box-shadow: 0px 0px 0px 5px #00a968;
  border: dashed 1px #fff;
}

.title_wrapper{
 max-width: 1300px;
 margin: 10px auto;
}

.title_thumb img {
    width: 100%;
    height: auto;
    max-height: 300px;
    max-width: fit-content;
}

.title_thumb{
 background-color: #fff;
 display: inline-block;
 width: 210px;
 min-height: 665px;
 border: 1px solid #2e8b57;
 padding: 10px;
 text-align: center;
 vertical-align: top;
 margin: 13px 11px;
box-shadow:2px 1px 1px 2px rgba(0, 0, 0, 0.05);
}

.thumb_img{
 width: 200px;
 height: 320px;
 position: relative;
 margin: 0 auto;
}

.thumb_img img{
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 margin: auto;
}

.sp_text{
 height:30px;
 font-size:14px;
}

.sp_text,.sp_text_new{
 font-weight: bold;
 color: #c70067;
}

.sp_text_new{
 padding: 4px 0;
 *margin: 0 0 6px 0;
 background-color: #c70067;
 color: #fff;
}

.title_thumb p{
 min-height: 100px;
 font-size: 13px;
}

.buy_button{
 padding: 10px 3px;
 margin: 10px;
 background-color: #00a968;
 border-radius: 5px;
 color: #fff;
 font-weight: bold;
 border: solid 1px #006400;
 box-shadow:0px 2px 2px 0px rgba(0, 0, 0, 0.2);
 font-size:0.8rem;
}

.thumb_img_height{
 width: 200px;
 height: 300px!important;
 position: relative;
 margin: 20px auto 0;
}

.thumb_img_height img{
 width: auto;
 height: 350px!important;
 position: relative;
}


@media screen and (orientation:portrait) {

html{
 min-height: 100%;
}

.main_title{
 width:100vw;
 font-size: 62px;
}

.new_title{
 font-size: 40px;
 padding: 10px 0px 10px 20px;
 margin: 15px;
}

.new_wrap{
 max-height: 400px;
 padding: 0px 0px 10px 10px;
 margin: 0 auto;
 overflow: auto;
 font-weight: bold;
 font-size: 13px;
}

dt{
 display: block;
 padding: 10px;
}

dd{
 display: block;
 padding: 10px;
}

.title_jumper{
 margin: 20px auto 0;
 padding: 34px;
}

.title_jumper li{
 padding: 25px 20px;
 margin: 15px 3px;
 font-size: 34px;
 border-radius: 3px;
}

.title_jumper div{
 width: 200px;
 background-color: #00a968;
 padding: 10px 40px;
 margin: 10px 11% 10px 11%;
 font-size: 20px;
 border-radius: 3px;
}

.title_infotext{
 max-width: 1300px;
 font-size: 34px;
 margin: 20px;
}

.title_line{
 max-width: 1300px;
 font-size: 32px;
 padding: 10px 0px 10px 10px;
 margin: 0px auto;
}

.title_wrapper{
 min-width: 720px;
 margin: 20px 3.5%;
 *text-align: center;
}

.title_thumb img{
 width: 90%;
 height: auto;
 max-height: fit-content;}

.title_thumb{
 display: inline-block;
 min-width: 400px;
 *min-height: 1600px;
 border: 1px solid #a9a9a9;
 padding: 10px;
 text-align: center;
 vertical-align: top;
 margin: 13px 11px;
 font-size: 29px;
 *position: relative;
}


.thumb_img{
 width: 400px;
 height: 650px;
 position: relative;
}

.thumb_img img{
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 margin: auto;
}

.sp_text{
    height: 60px;
}

.sp_text,.sp_text_new{
 font-size: 29px;
 font-weight: bold;
 color: #c70067;
}

.sp_text_new{
 *height:170px;
 padding: 4px 0;
 margin: 0 0 10px 0;
 background-color: #c70067;
 color: #fff;
}

.title_thumb p{
 min-height: 250px;
 font-size: 28px;
}

.buy_button{
 padding: 25px 15px;
 margin: 35px 7px;
 background-color: #00a968;
 border-radius: 5px;
 color: #fff;
 font-weight: bold;
 font-size: 1.55rem;
}

.thumb_img_height{
 width: 400px;
 height: 610px!important;
 margin: 40px 0 0!important;
}

.thumb_img_height img{
 width: auto;
 height: 100%!important;
}

}

