@charset "utf-8";
/* CSS Document */
#ContentsBox{
display: none
}
.WideGreyBody{
	background-color:#f5f5f5;
}
#Wrapper{
	width: 100%;
	margin:0 auto;	
	overflow:hidden;
}

#Photo img{
display: block;
width: 100%;
height: auto
}

#Photo{
width: 100%;
max-width: 1156px;
margin:0 auto 60px;
padding: 30px 8px 20px 8px;
}

#PhotoSelected{
margin-bottom: 60px;
}

#PhotoSelected a.main_photo{
position: relative;
display: block;
border: solid 1px #fff;
margin-bottom: 10px;
}
#PhotoSelected a.main_photo:hover{
border: solid 1px #ed1c29
}
#PhotoSelected a.main_photo::after {
content: "";
background:url("../04img/go_product.png") no-repeat center;
background-color: rgba(255,255,255,0.6);
background-size: 50px auto;
display: block;
position: absolute;
width: 50px;
height: 50px;
right:0;
top:0;
font-weight: normal;
padding-right: 2px;
padding-left: 4px;
color: #000;
cursor: pointer
}

.notice{
font-size:18px;
margin-bottom: 10px;
}

.notice span {
font-size: 24px;
color: #333;
font-weight: bold;
}
#PhotoInfo dt{
font-size:18px;
width: 160px;
float: left;
clear: both;
position: relative;
font-weight: bold;
margin-bottom: 10px;
}

#PhotoInfo dt:after{
position: absolute;
width: 10px;
height: 30px;
content:":";
right:5px;
top:-1px;
}

#PhotoInfo dd{
font-size:18px;
padding-left:160px;
padding-top: 3px;
margin-bottom: 10px;
font-weight: bold
}

#PhotoInfo a{
margin-right: 15px
}

#PhotoInfo dd#Advice{
font-size:14px;
font-weight:normal;
}

#PhotoList{
display: flex;
flex-flow: wrap;
justify-content: flex-start;
gap:1%;
}

.pic_box{
width: 24%;
margin-bottom: 10px;
border:solid 1px #fff;
}

.pic_box:hover{
border:solid 1px #ed1c29;
}

@media screen and (min-width: 1100px) {
#MainNaviWrapForCol1 {
  box-sizing: content-box
}
}

@media screen and  (max-width: 1099px){
#Wrapper {
width: 100%;
}	
#Copyright_mb {
  display: block;
}
}

@media screen and  (max-width: 1099px){
#PhotoInfo a{
display: block
}
}

@media screen and  (max-width: 900px){
#PhotoList{
gap:2%;
}
.pic_box{
width:32%;
}
}

@media screen and  (max-width: 767px){
  #Photo .notice span {
    font-size: 17px;
  }
  }

@media screen and  (max-width: 719px){
#PhotoList .pic_box{
width: 49%;
}
.notice{
font-size:14px;
margin-bottom: 5px;
}

#PhotoInfo dt{
font-size:16px;
width: auto;
float:none;
margin-bottom:0;
background:#f5f5f5;
padding:5px;
font-weight: normal
}

#PhotoInfo dt:after{
display: none
}

#PhotoInfo dd{
font-size:16px;
padding:10px;
margin-bottom: 0;
}




}