@charset "utf-8";

html {
width: 100%;
height: 100%;
}

body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}

img {
width: 100%;
height: 100%;
object-fit: contain;
vertical-align: middle;

}

/* Chrome-Edge等、画像のぼやけ対策(始)
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {

body {
image-rendering: -webkit-optimize-contrast;
}


}
Chrome-Edge等、画像のぼやけ対策(終) */




@media screen and (min-width: 0px) and (max-width: 700px) {
	
.photo_page_main {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
background: linear-gradient( 100deg, rgba(50,184,235,0.9), rgba(50,184,235,0.9)), url(/others/all_img/haikei_photo_mo.jpg?1689598835);
background-size: cover;
background-attachment: fixed;
background-position: left bottom;
background-repeat: no-repeat;
}
	
.photo_page_copyright { /* mo-コピーライト */
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 10%;
background: rgba(0,0,0,0.2);
color: #FFFFFE;
}

.photo_page_photo_wrapper { /* mo-写真の枠 */
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 90%;
position: relative;
}

.photo_page_photo_size { /* mo-写真のサイズ */
width: 98%;
background-size: contain; 
background-repeat: no-repeat;
background-position: center;
position: absolute;
top: 0; /* mo-『top』と『bottom』の数値で画像の縦幅を変えられる */
bottom: 0; /* mo-『top: 0;』『bottom: 0;』で高さが親要素と同じになる */
left: 1%;
right: 0;
}

.photo_page_return { /* mo-戻るボタン */
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 10%;
color: #FFFFFE;
background: rgba(0,0,0,0.2);
}


}




@media screen and (min-width: 701px) { 

.photo_page_main {
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
	
.photo_page_copyright { /* pc-コピーライト */
display: flex;
flex-flow: column nowrap;
align-items: center;
justify-content: center;
width: 100%;
height: 5%;
color: #FFFFFE;
font-size: 75%;
background: rgba(0,0,0,0.1);
}

.photo_page_photo_wrapper { /* pc-写真の枠 */
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 90%;
position: relative;
}

.photo_page_photo_size { /* pc-写真のサイズ */
width: 98%;
background-size: contain; 
background-repeat: no-repeat;
background-position: center;
position: absolute;
top: 0; /* pc-『top』と『bottom』の数値で画像の縦幅を変えられる */
bottom: 0; /* pc-『top: 0;』『bottom: 0;』で高さが親要素と同じになる */
left: 1%;
right: 0;
}

.photo_page_return { /* pc-戻るボタン */
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 5%;
background: rgba(0,0,0,0.1);
color: #FFFFFE;
font-size: 75%;
transition: 1s;
}

.photo_page_return:hover {
background: rgba(0,124,175,1);
transition: 0.3s;
color: #FFFFFE;
}


}