@charset "UTF-8";
@import url("/css/lpreset.css");

*, *:before, *:after {
  box-sizing: border-box;
}
body{
  font-family: sans-serif;
}
a{
  text-decoration: none;
}
img{
  vertical-align: bottom;
  backface-visibility: hidden;
}
#wrapper{
  overflow: hidden;
}

#lp-head h1{
  text-align: center;
  padding:30px;
}
#lp-head h1 img{
  width:250px;
}

.h2{
  border-bottom:1px solid #555;
  padding:5px 0;
  margin:18px 0 25px;
  text-align: center;
  font-size:25px;
  font-weight: bold; 
  color: #333;
}

.h2 i{
  margin-left:10px;
}
.h2none{
  padding:5px 0;
  text-align: center;
  font-size:25px;
  font-weight: bold;
  color: #333; 
}
.notice{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width:calc(100% - 80px);
  margin:20px auto;
  color:#333;
  font-size:0.9rem;
  border:1px solid #666;
  padding:10px;
}
.button{
  overflow: hidden;
  margin:25px auto;
  padding:0 auto;
}

.buttonbox{
  width:50%;
  float: left;
  text-align: center;
}

.toroku{
  display: inline-block;
  width:60%;
  text-decoration: none;
  text-align: center;
  padding:10px;
  background-color:#00ca57;
  border-radius:5px;
  color: #fff;
}

.login{
  display: inline-block;
  width:60%;
  text-decoration: none;
  text-align: center;
  padding:10px;
  background-color:#f6875b;
  border-radius:5px;
  color: #fff;
}
.cont-imglist ul{
  display: flex;
  flex-wrap: wrap;
  width:calc(100% - 40px)
  margin:0 auto 20px;
}
.cont-imglist ul li{
  width:calc((100% - 30px) / 4);
  margin-right:10px;
  margin-bottom:10px;
}
.cont-imglist ul li:nth-of-type(4n){
  margin-right:0;
}

.cont-imglist ul li img{
  width:100%;
}
.more{
  display: block;
  text-align: right;
  padding: 10px;
  text-decoration: none;
  color: #00ca57;
}

.short{
  width:50%;
  float: left;
  border-bottom:1px solid #666;
}

.right{
  float: right;
  border-left:1px solid #666;
  box-sizing:border-box;
}

.long{
  width: 100%;
  overflow: hidden;
  border-bottom:1px solid #666;
}

#cont-jenre ul{
  display: flex;
  flex-wrap: wrap;
  width:calc(100% - 40px);
  margin:0 auto;
}
#cont-jenre ul li{
  width:calc((100% - 20px) / 2);
  margin-bottom:20px;

}
#cont-jenre ul li:nth-of-type(2n){
  margin-left:20px;
}
#cont-jenre ul li img{
  width:100%;
  padding:10px;
}
#cont-jenre ul li a{
  display: block;
  border:1px solid #666;
  padding:10px 0 ;
  color:#333;
  text-align: center;
}
#cont-menu{
  text-align: center;
  margin:5px 0 20px;
}

#cont-menu ul li{
  display: inline-block;
  text-align: center;
  font-size:0.9rem;
  padding: 0 10px 0 10px;
  margin:10px 0;
  border-right: 1px solid #666; 
}
#cont-menu ul li:last-child{
  border:none;
}

#cont-menu a{
  text-decoration: underline;
  color: #333;
}

.copy{
  text-align: center;
  font-size:12px;
  color: #fff;
  padding:50px 0;
  background:#666;
}

.pick img{
  border-radius: 5px;
}

.pick{
  width: 100%;
  table-layout: fixed;
}

.pick td{
  padding:5px;
}

.size{
  font-size: 6em
}

.text{
  width:90%;
  margin:10px auto;
  font-size:12px;
  color: #333;
  border:1px solid #333;
  padding:5px;
  border-radius: 5px;
}
.imgbox{
  width: 100%;
}

.imgbox td{
  width: 25%;
  vertical-align: top;
  text-align: center;
  font-size: 10px;
  color: #333333; 
  padding: 5px;
}

.imgbox a{
  text-decoration: none;
  color: #333;
}