@charset "utf-8";

#main_ > article {width:940px; position:relative; margin:0 auto;}
#main_ > article + article {margin-top:2em;}
#main_ > article > header {position:relative; padding:60px 0 30px; border-bottom: 1px solid #e5e5e5;}
#main_ > article > header > h1 {color:#964040; font-size:3.6rem; line-height:1;}
#main_ > article > header > h1 > small {display:block; margin:0 0 0.5em; color:#964040; font-size:2.0rem;}
#main_ > article > header > p {margin:0.5em 0 0; font-size:1.4rem;}
#main_ > article > header > small {display:block; margin:2em 0 0; font-size:1.2rem;}

#main_ > article > .list {margin:30px 0 0; /*border-top:1px solid #e5e5e5;*/}
#main_ > article > .list > h1 {display:none;}
#main_ > article > .list > ul {
	display:-webkit-flex; display:-ms-flexbox; display:flex; 
	-webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; 
	width:960px; margin:0 -10px;}
#main_ > article > .list > ul > li {width:220px; /*margin:60px 0 0; padding:0 20px;*/ padding: 60px 20px; -webkit-flex: 0 0 29%; -ms-flex: 0 0 29%; flex: 0 0 29%; border-right: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;
}
#main_ > article > .list > ul > li:nth-child(3n){border-right: none;}
/*#main_ > article > .list > ul > li:nth-last-child(-n+1) {border-bottom: none;}*/
#main_ > article > .list > ul > li > a {display:block; text-decoration:none;}
#main_ > article > .list > ul > li .image {}
#main_ > article > .list > ul > li .image > img {display:block; width:auto; height:200px; margin:0 auto; -webkit-backface-visibility:hidden; backface-visibility:hidden;box-shadow: 0 0 5px #f1a4a4;}
#main_ > article > .list > ul > li h2 {margin:1em 0 0.3em; font-size:1.5rem; font-weight:bold; line-height:1.2;}
#main_ > article > .list > ul > li p.tokuten {font-size: 1.4rem; line-height: 1.6rem;color: #427af7;}
#main_ > article > .list > ul > li .download, 
#main_ > article > .list > ul > li .support  {border:1px solid #cc0e19; background:#fff; color:#cc0e19; font-weight:bold; line-height:1;}
#main_ > article > .list > ul > li .download {
	position:relative; margin:1em 0 0; padding:15px 3em 15px 15px; border:1px solid #cc0e19; background:#fff; color:#cc0e19; font-size:1.4rem; text-align:left;}
#main_ > article > .list > ul > li .download::after {
	display:block; content:"\e633"; width:2em; position:absolute; right:0; top:50%; margin:-0.6em 0 0; font:normal 1.8em/1 icons; text-align:center;}
#main_ > article > .list > ul > li .download:hover {border-color:#e06e75; color:#e06e75;}
#main_ > article > .list > ul > li .support {margin:0.8em 0 0; padding:10px; font-size:1.2rem;}
#main_ > article > .list > ul > li .support:hover {border-color:#e06e75; color:#e06e75;}

#main_ > article#online_contents > .list > ul > li .download {background-color:#cc0e19; color:#fff;}
#main_ > article#online_contents > .list > ul > li .download:hover {background-color:#e06e75;}

#main_ > article > .list > footer {padding:60px 0 0;}
#main_ > article > .list > footer > nav {border-top:1px solid #e5e5e5; font-size:1.4rem;}
#main_ > article > .list > footer > nav > * {display:block; position:relative; padding:2em;}
#main_ > article > .list > footer > nav > *::after {
	display:block; width:1em; position:absolute; top:50%; margin:-0.5em 0 0; color:#cc0e19; font:normal 2em/1 icons; text-decoration:none; transition:color 0.2s ease-in-out 0s;}
#main_ > article > .list > footer > nav > *.previous {float:left;}
#main_ > article > .list > footer > nav > *.next     {float:right;}
#main_ > article > .list > footer > nav > *.previous::after {content:"\e603"; left:0;}
#main_ > article > .list > footer > nav > *.next::after     {content:"\e601"; right:0;}
#main_ > article > .list > footer > nav > *:hover::after {color:#e06e75;}
#main_ > article > .list > footer > nav > a.previous {}
#main_ > article > .list > footer > nav > a.next {}
#main_ > article > .list > footer > nav > span {visibility:hidden;}


/* font */
#main_ > article > header > h1
	{font-family:"Yu Mincho", YuMincho, serif;}


@media screen and (max-width:599px) {

#main_ > article {width:auto; padding:0 16px;}
#main_ > article + article {}
#main_ > article > header {padding:20px 0;}
#main_ > article > header > h1 {font-size:2.0rem; font-size:6.25vw;}
#main_ > article > header > h1 > small {font-size:1.4em; font-size:4.375vw;}
#main_ > article > header > p {font-size:1.2rem; font-size:3.75vw; text-align:left;}
#main_ > article > header > small {margin:1em 0 0; font-size:1.0rem; font-size:3.125vw; text-align:left;}
#main_ > article > header > small br {display:none;}

#main_ > article > .list {margin:20px 0 0; padding:2em 0 0;}
#main_ > article > .list > h1 {}
#main_ > article > .list > ul {display:block; width:auto; margin:0;}
#main_ > article > .list > ul > li {width:auto; margin:3em 0 0; padding: 0 0 3em;border-right: none;}
#main_ > article > .list > ul > li:first-child {margin-top:0;}
#main_ > article > .list > ul > li > a {display:block; text-decoration:none;}
#main_ > article > .list > ul > li .image {width:50%; margin:0 auto;}
#main_ > article > .list > ul > li .image > img {width:100%; height:auto;}
#main_ > article > .list > ul > li h2 {line-height:1.2; font-size:1.35rem; font-size:4.21875vw;}
#main_ > article > .list > ul > li .download, 
#main_ > article > .list > ul > li .support  {max-width:220px; margin-left:auto; margin-right:auto; box-sizing:border-box;}
#main_ > article > .list > ul > li .download {}
#main_ > article > .list > ul > li .download::after {}
#main_ > article > .list > ul > li .download:hover {}
#main_ > article > .list > ul > li .support {}
#main_ > article > .list > ul > li .support:hover {}

#main_ > article > .list > footer {padding:3em 0 0;}
#main_ > article > .list > footer > nav {margin:3em 0 0; font-size: 0.8rem; font-size: 2.5vw;}
#main_ > article > .list > footer > nav > * {display:block; position:relative; padding:2em;}
#main_ > article > .list > footer > nav > *::after {}
#main_ > article > .list > footer > nav > *.previous {}
#main_ > article > .list > footer > nav > *.next     {}
#main_ > article > .list > footer > nav > *.previous::after {}
#main_ > article > .list > footer > nav > *.next::after     {}
#main_ > article > .list > footer > nav > *:hover::after {}
#main_ > article > .list > footer > nav > a.previous {}
#main_ > article > .list > footer > nav > a.next {}
#main_ > article > .list > footer > nav > span {}


/* font */
#main_ > article > header > h1
	{}

}