@charset "UTF-8";

@media only screen and (max-width: 979px) {
/*-------------------------------------
basic
-------------------------------------*/
h1 { font-size: 50px; }
h2 { font-size: 40px; }
h3 { font-size: 18px; }
/*p, ul, dl, table, input, select, address, span { font-size: 14px; line-height: 1.8; }*/

/*-------------------------------------
header
-------------------------------------*/
header { width: 100%; }
header .logo { width: 70%; height: 70px; }
header .logo a { padding: 23px 0 23px 20px; }
header .logo img { max-width: 220px; }
header .menu { width: 30%; position: absolute; top: 0px; right: 0; }
header .menu a { width: 100%; height: 70px; }
header .menu-list li a { width: 100%; }

/*-------------------------------------
footer
-------------------------------------*/
footer { text-align: center; }
footer address { float: none; margin: 0; }
footer ul { float: none; border: none; }
footer li { margin: 0; }
footer p { float: none; }

/*-------------------------------------
top
-------------------------------------*/
.topvisual { width: 100%; position: relative; overflow: hidden; }
.topvisual .arrow { position: absolute; z-index: 1; bottom: 200px; left: 50%; }
.topvisual .arrow a { padding: 30px; margin-left: -47px; }
.topvisual .arrow a:after { width: 30px; height: 30px; }
.topvisual .bxslider li { font-size: 80px; }
.topvisual .bxslider small { font-size: 16px; }
.toplist .block { width: 100%; }
.topnews .block { width: 48%; }


/*-------------------------------------
pages-cover
-------------------------------------*/
.cover { margin-top: 70px; }

/*-------------------------------------
pages-common
-------------------------------------*/
.headline { padding-top: 50px; padding-bottom: 50px; }
.headline h2 span { margin-top: 8px; }
.headline h3 { margin-top: 10px; }
.headline p { margin-top: 10px; }
.media { display: block; }
.media .headline { padding-top: 50px; padding-bottom: 20px; }
.media .content { padding-bottom: 50px; }
}



@media only screen and (max-width: 639px) {
/*-------------------------------------
top
-------------------------------------*/
.topvisual .bxslider li { font-size: 50px; }
.topvisual .bxslider small { font-size: 16px; }

.toplist { width: 100%; padding: 0; }
.toplist .block { width: 100%; }
.toplist .block h2 { font-size: 16px; padding: 10px; }
.toplist .block .caption { display: none; }

.topnews { width: 100%; padding: 0; padding: 20px 0px; }
.topnews h2 { font-size: 24px; padding-left: 10px; }
.topnews h2 span { left: 260px; top: 20px; font-size: 14px; }
.topnews h2 span a { padding: 5px 10px; }
.topnews .block { width: 48%; }
.topnews .info { min-height:156px; }

/*-------------------------------------
pages-cover
-------------------------------------*/
.cover { padding: 100px 0; }

/*-------------------------------------
pages-common
-------------------------------------*/
.headline { padding-top: 40px; padding-bottom: 40px; }
.headline h2 span { margin-top: 8px; }
.headline h3 { margin-top: 10px; }
.headline p { margin-top: 10px; }
.media { display: block; }
.media .headline { padding-top: 40px; padding-bottom: 20px; }
.media .content { padding-bottom: 40px; }

/*-------------------------------------
recruit
-------------------------------------*/
.recruit { padding-bottom: 60px; }

/*-------------------------------------
news
-------------------------------------*/
.news { padding-bottom: 60px; }
.news .content dl { width: 100%; }
.news .content dt { width: 100%; padding: 20px 0 0px; }
.news .content dd { width: 100%; padding: 10px 0 20px; margin: 0; border: none; }

/*-------------------------------------
company
-------------------------------------*/
.company { padding-bottom: 60px; }
.company .content dl { width: 100%; }
.company .content dt { width: 100%; padding: 20px 0 0px; }
.company .content dd { width: 100%; padding: 10px 0 20px; margin: 0; border: none; }
.company .content dd span { width: 100%; padding: 10px 0 0px; margin: 0; display: block; }

/*-------------------------------------
contact
-------------------------------------*/
.contact { padding-bottom: 60px; }
.contact .content dl { width: 100%; }
.contact .content dt { width: 100%; padding-bottom: 0; }
.contact .content dd { width: 100%; padding: 10px 0 20px; margin: 0; border: none; }
.contact .content dd span { width: 100%; padding: 10px 0 0px; margin: 0; display: block; }

/*-------------------------------------
privacy
-------------------------------------*/
.privacy { padding-bottom: 60px; }
}
