@charset "UTF-8";

html,body{
 margin:0;
 padding:0;
 height:100%;
 width:100%;
 font-family:"メイリオ", sans-serif;
}

#gallery{
 display:flex;
 flex-wrap:wrap;
 width:100%;
 height:100%;
}

.photo{
 width:33.33%;
 height:50%;
 background-size:cover;
 background-position:center;
 background-repeat:no-repeat;
}

.img1 {background-image: url('france.png');}
.img2 {background-image: url('america.png');}
.img3 {background-image: url('china.png');}
.img4 {background-image: url('australia.png');}
.img5 {background-image: url('india.png');}
.img6 {background-image: url('egypy.png');}

#links{
 padding:80px 20px;
 text-align:center;
 background-image:url("map.png");
 background-size:cover;
 background-position:center;
 background-repeat:no-repeat;
 background-attachment:fixed;
}

.main-box{
 background-color:white;
 width:60%;
 margin:0 auto;
 padding:30px;
 border:2px solid orange;
 opacity:0.95;
}

.link-list{
 list-style-type:none;
 padding:0;
}
.link-list li{
 margin-bottom:15px;
 font-size:20px;
 font-weight:bold;
}
a{
 text-decoration:none;
 color:#003366;
}
a:hover{
 color:red;
}


.page-box{
 background-color:white;
 width:80%;
 margin:50px auto;
 padding:40px;
 border:5px double orange;
 text-align:center;
}

.info-table{
 width:100%;
 border-collapse:collapse;
 margin:20px 0;
 font-size:16px;
}

.info-table th, .info-table td{
 border:1px solid orange;
 padding:10px;
}

.info-table th{
 background-color:#ffe4b5;
 width:30%;
}

.info-table td{
 background-color:white;
 text-align:left;
}

.description{
 text-align:center;
 background-color:white;
 border:2px solid orange;
 padding:20px;
 margin:20px 0;
 font-size:18px;
 line-height:1.6;
}

.back-btn{
 display:inline-block;
 background-color:orange;
 color:white;
 padding:10px 30px;
 border:2px solid #e69500;
 font-weight:bold;
 margin-top:20px;
}
.back-btn:hover{
 background-color:red;
}