.a1{
background:url(../images/pickup/01.jpg) center -70px no-repeat;background-size:cover;
}

/*@media (min-device-width: 3000px) {
    .a1{
background:url(../images/article/01.jpg) center -120px no-repeat;background-size:cover;
    }
}*/

body{font-family:"游ゴシック", "Yu Gothic", "YuGothic", "Meiryo UI", "メイリオ", "Meiryo UI", sans-serif;}
body,header .bottom{min-width:960px;}
body,dl,figure{margin:0;padding:0;}
body,a{color:#000;text-decoration:none;}
a:hover{opacity:.7;}
header,
.bottom{opacity:0;}
img,th{vertical-align:middle;text-align: center;}
table{table-layout:fixed;border-collapse: collapse;border-spacing: 0;width:100%;}
h1{color:#ffc73a;}
h1,h2,h3,h4,p{font-weight:normal;max-height:100%;margin:0;padding:0;}
section,
footer{font-size:17px;margin-top:5em;}
footer{margin-top:7.5em;}
section:first-child{margin-top:0;}
section h1{font-size:18px;line-height:1.2;margin-bottom:1em;}
article h1{font-size:20px;line-height:1.2;margin-top:.25em;margin-bottom:0;color:#fff;}
article h2{font-size:17px;line-height:1.2;color:#fff;}
aside h1{}
aside h2{font-size:18px;line-height:1.6;margin-top:1em;}
#collection article h2{font-size:18px;line-height:1.4;}
#collection article h1{font-size:18px;line-height:1.4;}
#collection article p{font-size:17px;line-height:1.6;margin-top:.5em;}
article h2{font-size:17px;line-height:1.2;color:#fff;}
aside p{font-size:17px;line-height:1.6;margin-top:1em;}
section .more{font-size:18px;line-height:1.2;}
article a{display:block;height:600px;position:relative;}
article div.bg{position:absolute;bottom:0;left:0;background:rgba(0,0,0,.7);width:100%;}
article div.bg .inner{display:block;padding:1em;}
.line{display:none;}
.line:first-child,
.on .line{display:block;}

#recommend article a{height:300px;}
#recommend .wrap{overflow:hidden;}
#recommend article{width:32%;float:left;margin-left:2%;margin-bottom:2%;}
#recommend article:first-child{margin-left:0;}

#popup{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.25);z-index:10;text-align:center;margin:0;z-index:999;cursor:pointer;}
#popup article{background:#fff; position: absolute; top: 0; left: 50%; margin-left: -460px; overflow: scroll; overflow-x: hidden; width: 920px; height: 100%;cursor:default;}
#popup article .wrap{width:670px;margin:0 auto;padding:3em 0;}
#popup article h1{font-size:31px;line-height:1.4;color:#ffc73a;}
#popup article h2{font-size:19px;line-height:1.4;color:#000;}
#popup article h3{font-size:19px;line-height:1.6;margin:1em 0;}
#popup article p{font-size:14px;line-height:2;margin:1em 0;}
#popup article a{height:auto;margin-top:4em;}
#popup article div{margin:1.5em 0;}
#popup article hr{width:50%;margin:3em auto 1.5em;border:0 none;height: 1px;background-color:#000;}
#popup article figure{width:100%;height:400px;display:inline-block;}
#popup article figure.img2{width:49%;height:230px;margin-left:2%;}
#popup article figure.img2:first-child{margin-left:0;}
#popup article figure.img3{width:32%;height:200px;margin-left:2%;}
#popup article figure.img3:first-child{margin-left:0;}
#popup #close {display: block;
width: 31px;
height: 31px;
position: fixed;
top: 25px;
right: 50%;
margin-right: -425px;
cursor: pointer;
z-index: 5; }
#popup #close:before {
content: '';
display: block;
width: 100%;
height: 1px;
background: #000;
position: absolute;
top: 15px;
left: 0;
-webkit-transform: skew(0deg, 45deg);
-ms-transform: skew(0deg, 45deg);
transform: skew(0deg, 45deg);}
#popup #close:after {
content: '';
display: block;
width: 100%;
height: 1px;
background: #000;
position: absolute;
top: 15px;
left: 0;
-webkit-transform: skew(0deg, -45deg);
-ms-transform: skew(0deg, -45deg);
transform: skew(0deg, -45deg);}



#collection article dt{width:200px;height:200px;float:left;margin-right:1.5em;}
#collection article dl,
#collection article dd{overflow:hidden;}
#collection .wrap{overflow:hidden;}
#collection article{width:49%;float:left;margin-left:2%;margin-bottom:2%;}
#collection article:first-child{margin-left:0;margin-bottom:0;}
#collection article h2,
#collection article h1{color:#000;}

#about{position:relative;}
#about aside{/*background:#ffc73a;*/}
#about img{max-width:100%;}
#about th{width:50%;position:relative;background:#ffffff;}
#about td{width:50%;position:relative;background:#ffc73a;}
#about td div{padding:3em 2em;}
#about td span{display:inline-block;}
#about th div{width:100%;height:100%;position:absolute;left:0;top:0;}
#about a{display:block;width:29px;height:29px;position:absolute;right:0;top:-8px;}

section .more{display:block;text-align:center;background:#ffc73a;color:#fff;padding:.5em 0;}
section .more:after{content:"SEE MORE ▼";}
section.on .more:after{content:"CLOSE ▲";}

header{height:100vh;background:#ffc73a;text-align: center;}
header table{width: 100%;height: 100%;}
header img{max-width: 70%;}
header .bottom{position:absolute;bottom:0;left:0;display:block;text-align: center;width: 100%;}
header p{font-size:18px;line-height:1.2;color:#fff;}
header .arrow{display:inline-block;width: 20px;height: 20px;margin-bottom:30px;border: 3px solid;border-color:transparent transparent #fff #fff;transform: rotate(-45deg);}

#about h2{font-size:18px;line-height:1.6;}
#about p{font-size:17px;line-height:1.6;}

footer a{font-size:17px;line-height:1.2;}
footer a{display:inline-block;}
footer p{font-size:17px;line-height:1.2;margin-top:2em;}

#wrap{padding:5% 5% 2.5%;}
footer{text-align:center;}
footer a{/*width:49%;*/width:32%;margin-left:2%;position:relative;}
footer a:first-child{margin-left:0;}
#popup a span,
footer a span{border:1px solid;padding:2em 0;display:block;position:relative;z-index:99;}

article div.bg:after,
#popup a:after,
footer a:after{content:"";position:absolute;right:0;bottom:0;width: 0;height: 0;border-style: solid;border-width: 0 0 25px 25px;border-color: transparent transparent #ffc73a; }

footer a:nth-child(3):after{content:"";position:absolute;right:0;bottom:0;width: 0;height: 0;border-style: solid;border-width: 0 0 25px 25px;border-color: transparent transparent #294992; }


@media (max-device-width: 750px) {

body,header .bottom{min-width:640px;}
a:hover{opacity:1;}
article a{height:400px;}
header img{max-width: 80%;}
#popup article{margin-left: -320px; width: 640px;}
#popup article .wrap{width:auto;margin:0 auto;padding:3em 5%;}
#popup #close {margin-right: -295px;}
#recommend article{width:49%;margin-left:2%;margin-bottom:2%;}
#collection article{width:100%;float:none;margin-left:0;}
#collection article:first-child{margin-bottom:2%;}
#about aside th,
#about aside td{width:100%;float:none;display: block;}
#about aside th{height:330px;}

footer a{font-size:16px;width:100%;margin-left:0;margin-top:10px;}
footer p{font-size:16px;}

footer a:nth-child(3){background:#294992;color:#ffffff;}
footer a:nth-child(3):after{border-style:none;border-width: none;border-color:none; }

}