@charset "utf-8";
/* CSS Document */

/*-----------------------------------------------
base
#38678C 青
#BA1E0F 赤
-----------------------------------------------*/



#main .bold {
font-weight:bold;
}
#main .red {
color:#F00;
}

#main .btn {
font-weight:bold;
color:#FFF;
background:#BA1E0F;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.51, #931c10), color-stop(0.49, #BA1E0F));
background: -webkit-linear-gradient(top, #BA1E0F 49%, #931c10 51%);
background: -moz-linear-gradient(top, #BA1E0F 49%, #931c10 51%);
background: -o-linear-gradient(top, #BA1E0F 49%, #931c10 51%);
background: -ms-linear-gradient(top, #BA1E0F 49%, #931c10 51%);
background: linear-gradient(to bottom, #BA1E0F 49%, #931c10 51%);
box-shadow:2px 2px 5px 0px #CCC;
border:2px solid #FFF;
border-radius:10px;
-webkit-transition:all 0.2s ease-out;
transition:all 0.2s ease-out;
}
#main .btn a {
display:block;
padding:1.5em 1em 1.5em 3em;
color:#FFF;
text-decoration:none;
background:url(../img/arw01_white.png) 2em center no-repeat;
background-size:0.5em;
}
#main .btn:hover {
opacity:0.8;
}


#main h1 {
padding:0.5em;
font-size:2em;
font-weight:bold;
text-align:center;
color:#FFF;
background:#38678C;
}

@media (max-width:600px) {
#main h1 {
font-size:1.25em;
}
}


/*-----------------------------------------------
  fair
-----------------------------------------------*/

#fair {
overflow:hidden;
}
#fair img {
display:block;
width:100%;
}
#fair .visual {
float:left;
width:66.6666%;
}
#fair .title {
position:relative;
float:right;
width:33.3333%;
}
#fair .partner {
position:absolute;
left:5%;
bottom:4%;
width:90%;
background:#FFF;
}
#fair .partner dl {
width:100%;
font-size:1.25vw;
overflow:hidden;
}
#fair .partner dt {
padding:0.5em 1em;
text-align:center;
color:#FFF;
background:#38678C;
}
#fair .partner dt a {
color:#FFF;
}
#fair .partner .button {
margin:2.5% auto 0 auto;
width:90%;
}
#fair .partner .button img {
border-radius:6px;
border:2px solid #FFF;
box-shadow:2px 2px 4px #999;
}
#fair .partner .button a {
-webkit-transition:all 0.2s ease-out;
transition:all 0.2s ease-out;
}
#fair .partner .button a:hover {
opacity:0.8;
}
#fair .partner .text {
margin:1.5% 0 2.5% 0;
text-align:center;
font-size:1.5vw;
}

@media (max-width:800px) {
#fair .visual {
float:none;
width:100%;
}
#fair .title {
float:none;
width:100%;
}
#fair .partner dl {
font-size:3vw;
}
#fair .partner p.text {
font-size:4vw;
}
}

@media (max-width:600px) {
#fair h2 {
font-size:2.5em;
}
}



/*-----------------------------------------------
  info
-----------------------------------------------*/

#info {
max-width:1280px;
margin:40px auto 0 auto;
padding:60px 4% 0 4%;
}
#info h3 {
padding:0.1em 1em;
font-size:3em;
line-height:1.25;
text-align:center;
color:#1F4778;
background:#97B559;
}
#info p {
margin-top:1em;
font-size:1.5em;
line-height:2;
text-align:center;
}

@media (max-width:600px) {
#info {
padding:0 4%;
}
#info h3 {
font-size:1.5em;
}
#info p {
font-size:1.1em;
}
}


/*-----------------------------------------------
  item
-----------------------------------------------*/

#item {
max-width:1280px;
margin:40px auto 0 auto;
padding:60px 4% 0 4%;
}
#item h3 {
font-size:3em;
line-height:1.25;
text-align:center;
}
#item .photo {
margin-top:20px;
font-size:0;
overflow:hidden;
}
#item .photo li {
display:inline-block;
width:32.3%;
margin:1% 0.5%;
font-size:14px;
line-height:1.4;
vertical-align:top;
}
#item .photo img {
display:block;
width:100%;
margin-bottom:0.25em;
}

@media (max-width:800px) {
#item {
margin-top:10%;
padding:10% 4%;
}
#item h3 {
font-size:1.5em;
}
#item .photo li {
width:48%;
margin:2% 1%;
}
}


/*-----------------------------------------------
  slider
-----------------------------------------------*/

#slider {
max-width:1280px;
margin:40px auto 0 auto;
padding:0 4%;
}
#slider img {
width:100%;
}


/*-----------------------------------------------
  message
-----------------------------------------------*/

#message {
max-width:1280px;
margin:40px auto 0 auto;
padding:40px 4% 0 4%;
}
#message p {
padding:1.5em 0;
font-size:1.5em;
line-height:2;
text-align:center;
border-top:4px solid #CCC;
border-bottom:4px solid #CCC;
}

@media (max-width:600px) {
#message {
margin-top:0;
padding:0 4%;
}
#message p {
font-size:1.1em;
}

}


/*-----------------------------------------------
  campaign
-----------------------------------------------*/

#campaign {
max-width:1280px;
margin:40px auto 0 auto;
padding:20px 4% 0 4%;
}
#campaign h3 {
margin:2em 0 0.5em 0;
padding:0.25em 0 0.25em 1em;
font-size:1.5em;
letter-spacing:0.1em;
background:#F0F0F0;
border-left:10px solid #F60;
}
#campaign img {
width:100%;
margin:10px 0;
}

#campaign .kinoaru {
display:flex;
flex-flow:row wrap;
justify-content:space-between;
}
#campaign .kinoaru li {
width:49%;
margin:10px 0;
font-size:1.2em;
text-align:center;
}
#campaign .kinoaru li.all {
width:100%;
}
#campaign .kinoaru li img {
margin:0;
}

@media (max-width:600px) {
#campaign {
margin-top:5%;
padding:0 4%;
}
#campaign h3 {
padding:0.25em 0 0.25em 0.5em;
font-size:1.1em;
letter-spacing:0;
border-left:5px solid #F60;
}

#campaign .kinoaru {
display:block;
}
#campaign .kinoaru li {
width:100%;
}
}

/*-----------------------------------------------
  partner
-----------------------------------------------*/

#partner {
margin-top:50px;
padding:0 4%;
text-align:center;
}
#partner h3 {
font-size:3em;
line-height:1.25;
text-align:center;
}
#partner h3 span {
font-size:0.5em;
}
#partner h4 {
padding:0.5em 0;
font-size:1.25em;
font-weight:bold;
}

#partner .container {
margin:0 auto;
font-size:0;
text-align:center;
}
#partner .column {
display:inline-block;
width:100%;
max-width:280px;
margin:4%;
font-size:15px;
vertical-align:top;
}
#partner .column img {
width:100%;
}
#partner .btn {
width:20em;
margin:0 auto;
}

@media (max-width:600px) {
#partner {
margin-top:10%;
padding:0 4%;
}
#partner h3 {
font-size:1.5em;
}
#partner .slider {
width:100%;
}
#partner .btn {
width:80%;
}
}


/*-----------------------------------------------
  company
-----------------------------------------------*/

#company {
max-width:1000px;
margin:40px auto 0 auto;
padding:60px 4% 0 4%;
text-align:center;
border-top:1px dotted #999;
}
#company h3 {
font-size:3em;
line-height:1.25;
text-align:center;
}

#company .container {
max-width:800px;
margin:0 auto;
font-size:0;
text-align:center;
}
#company dl {
display:inline-block;
width:100%;
max-width:300px;
margin:4%;
font-size:15px;
text-align:left;
vertical-align:top;
}

#company dt {
margin-bottom:0.5em;
font-size:1.25em;
font-weight:bold;
}
#company .address {
padding-left:2em;
background:url(../img/ico_address.png) left 4px no-repeat;
background-size:1.5em;
}
#company .tel {
padding:0.25em 0 0.25em 2em;
background:url(../img/ico_tel.png) left 4px no-repeat;
background-size:1.5em;
}
#company .name {
padding:0.25em 0 0.25em 2em;
}

@media (max-width:600px) {
#company {
margin-top:10%;
padding:10% 4% 0 4%;
}
#company h3 {
font-size:1.5em;
}
#company .slider {
width:100%;
}
}


/*-----------------------------------------------
  join
-----------------------------------------------*/

#join {
margin-top:50px;
padding:50px 4%;
text-align:center;
background:#F5F5F5;
}
#join h3 {
font-size:3em;
line-height:1.25;
text-align:center;
}
#join h3 + p {
margin-top:1em;
font-size:1.5em;
}
#join img {
border-radius:50%;
}
#join h4 {
padding:0.5em 0;
font-size:1.25em;
font-weight:bold;
}
#join .container {
font-size:0;
text-align:center;
}
#join .column {
display:inline-block;
width:100%;
max-width:280px;
margin:4%;
font-size:15px;
vertical-align:top;
}
#join .column img {
width:100%;
}
#join .btn {
width:16em;
margin:1em auto 0 auto;
}
#join .note {
width:16em;
margin-top:0.5em;
}


@media (max-width:600px) {
#join {
margin-top:10%;
padding:10% 4%;
}
#join h3 {
font-size:1.5em;
}
#join h3 + p {
font-size:1em;
}
}


/*-----------------------------------------------
  place
-----------------------------------------------*/

#place {
margin-top:50px;
padding:0 4%;
text-align:center;
}
#place h3 {
font-size:3em;
line-height:1.25;
text-align:center;
}
#place h4 {
margin-top:1em;
font-size:1.25em;
font-weight:bold;
}

#place .container {
max-width:1000px;
margin:2em auto 0 auto;
text-align:left;
overflow:hidden;
}
#place .data {
float:left;
width:25%;
}
#place .data img {
width:100%;
}
#place .open {
margin-top:1em;
}
#place .open dt {
margin-top:1em;
font-weight:bold;
}
#place .contact {
margin-top:2em;
}
#place .address {
padding-left:2em;
background:url(../img/ico_address.png) left 4px no-repeat;
background-size:1.5em;
}
#place .tel {
margin-top:2em;
padding:0.25em 0 0.25em 2em;
background:url(../img/ico_tel.png) left 4px no-repeat;
background-size:1.5em;
}
#place .fax {
padding:0.25em 0 0.25em 2em;
background:url(../img/ico_fax.png) left 4px no-repeat;
background-size:1.5em;
}
#place .mail {
padding:0.25em 0 0.25em 2em;
background:url(../img/ico_mail.png) left 4px no-repeat;
background-size:1.5em;
}

#place .map {
float:right;
width:65%;
}
#place .map iframe {
width:100%;
height:400px;
}
#place .access {
margin-top:2em;
}
#place .access dt {
margin-top:1em;
font-weight:bold;
}
#place .access dd {
margin-top:0.5em;
padding-left:1em;
text-indent:-1em;
}

#place .partner {
margin-top:4em;
}
#place .btn {
width:20em;
margin:1em auto 0 auto;
}

@media (max-width:800px) {
#place {
margin-top:10%;
padding:0 4%;
}
#place h3 {
font-size:1.5em;
}
#place .data {
float:none;
width:100%;
}
#place .map {
float:none;
width:100%;
margin-top:2em;
}
#place .map iframe {
width:100%;
height:500px;
}
}





/*-----------------------------------------------
  download
-----------------------------------------------*/

#download {
max-width:1280px;
margin:40px auto 0 auto;
padding:40px 4% 0 4%;
text-align:center;
}
#download h2 {
font-size:3em;
line-height:1.25;
}
#download p {
margin-top:1em;
}
#download p.btn {
max-width:24em;
margin:2em auto;
}

@media (max-width:600px) {
#download {
margin-top:10%;
padding:10% 4%;
}
#download h2 {
font-size:1.5em;
}
}
