.wrapper { margin: 180px auto 0; width: 100%; color: #000; font-family: Helvetica, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3"; letter-spacing: 0.1em; /*-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased;*/ }
.wrapper p.lead { font-size: 12px; font-family:  "Hiragino Mincho ProN", "ヒラギノ明朝 ProN W3"; letter-spacing: 2.5px; line-height: 2.4; margin: 0 auto 13.5%; margin-left: -4.4%; text-align: center; }
.wrapper p.lead span { display: inline-block; font-size: 14px; padding-bottom: 10px; }


.container { margin: 0 auto; padding-left: 1.8%; width: 92%; max-width: 1120px; letter-spacing: -1em; }
.container .box_main { display: block; margin: 7% auto 7%; width: 37%; vertical-align: top; }
.container .box_main .name { display: inline-block; vertical-align: top; white-space: nowrap; width: 10%; transform: rotate(90deg); font-size: 20.8px; letter-spacing: 0.25em; line-height: 1; margin: 2.7% 0 0; box-sizing: border-box; }
.container .box_main .image { display: inline-block; vertical-align: top; width: 90%; margin: 0; }
.container .box_main .image img { width: 100%; height: auto; }
.container .box_main ul { padding: 4% 10% 0 0; text-align: right; }
.container .box_main ul li { font-family:  "Hiragino Mincho ProN", "ヒラギノ明朝 ProN W3"; font-size: 11px; letter-spacing: 0.2em; }

.box_main { 
	opacity: 0;
	-webkit-animation: fadein-main 2.5s ease 0.5s 1 forwards;
	animation: fadein-main 2.5s ease 0.5s 1 forwards;
}

@-webkit-keyframes fadein-main {
	100%  { opacity: 1; } 
}
@keyframes fadein-main {
	100%  { opacity: 1; } 
}


.container .box { display: inline-block; margin: 0 auto 17%; margin-right: 6%; width: 29%; vertical-align: top; letter-spacing: normal; }
.container .box.end { margin-right: 0; }
.container .box .name { display: inline-block; vertical-align: top; white-space: nowrap; width: 10%; transform: rotate(90deg); /*transform-origin: top left;*/ font-size: 10px; letter-spacing: 0.25em; line-height: 1; margin: 3.2% 0 0; box-sizing: border-box; }
.container .box .image { display: inline-block; vertical-align: top; width: 90%; margin: 0; }
.container .box .image img { width: 100%; height: auto; }
.container .box ul { padding: 2% 10% 0 0; text-align: right; }
.container .box ul li { display: inline-block; letter-spacing: 0.1em; }
.container .box ul li a { color: #aaa; cursor: pointer; display: block; font-size: 10px; line-height: 1; padding: 0 8px; border-right: 1px solid #aaa; }
.container .box ul li a:hover { text-decoration: underline; }
.container .box ul li:first-child a { border-left: 1px solid #aaa; }



