html {
   width: 100%;
   height: 100%;
   font-size: 62.5%;
}
body {
   background-color: #FFF;
   color: #000;
   font-family: YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
   font-weight: bold;
   text-transform: none;
   font-size: 1.5rem;
   line-height: 1.8;
   -webkit-text-size-adjust: none;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}
.container {
   overflow: hidden;
   position: relative;
   max-width: 884px;
   z-index: 10000;
}
.row {
   margin-left: 0;
   margin-right: 0;
}
a {
   color: #000;
   text-decoration: none;
}
a:hover {
   color: #8ad0c2;
   text-decoration: underline;
   -webkit-transition: 0.2s ease-in-out;
   -moz-transition: 0.2s ease-in-out;
   -o-transition: 0.2s ease-in-out;
   transition: 0.2s ease-in-out;
}
a img {
   -webkit-transition: 0.2s ease-in-out;
   -moz-transition: 0.2s ease-in-out;
   -o-transition: 0.2s ease-in-out;
   transition: 0.2s ease-in-out;
}
a:hover img {
   opacity: 0.7;
   filter: alpha(opacity=70);
}

/*-----------------------------------------------------
mainvisual
-----------------------------------------------------*/


@media screen and (min-width: 1480px) {
#mainv {
   height: 1024px;
   background-color: #8ad0c2;
   position: relative;
}
#bg1 {
   background-image: url(/af/06/img/bg_catain.png);
   background-repeat: no-repeat;
   background-position: left 90% top -50px;
   background-size: 30%;
   height: 1024px;
}
#bg2 {
   background-image: url(/af/06/img/bg_table.png);
   background-repeat: no-repeat;
   position: relative;
   background-position: right 0 bottom -10px;
   background-size: 30%;
   height: 1024px;
}
#bg3 {
   background-image: url(/af/06/img/bg_pasta.png);
   background-repeat: no-repeat;
   background-position: left 0px top 50%;
   background-size: 30%;
   position: relative;
   height: 1024px;
}
.logo {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   margin: auto;
   max-width: 620px;
   height: auto;
}
.logo img {
   width: 100%;
   height: auto;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translateY(-50%) translateX(-50%);
 -webkit- transform: translateY(-50%) translateX(-50%);
}
.overview {
   position: absolute;
   overflow: hidden;
   bottom: 6%;
   left: 6%;
   width: 640px;
   height: auto;
}
.overview img {
   width: 100%;
   height: auto;
}
.overview2 {
   display: none;
}
}

@media screen and (min-width: 1280px) and (max-width: 1479px) {
#mainv {
   height: 1024px;
   background-color: #8ad0c2;
   position: relative;
}
#bg1 {
   background-image: url(/af/06/img/bg_catain.png);
   background-repeat: no-repeat;
   background-position: right 50px top -50px;
   background-size: 40%;
   height: 1024px;

}
#bg2 {
   background-image: url(/af/06/img/bg_table.png);
   background-repeat: no-repeat;
   position: relative;
   background-position: right 0 bottom -10px;
   background-size: 40%;
   height: 1024px;
}
#bg3 {
   background-image: url(/af/06/img/bg_pasta.png);
   background-repeat: no-repeat;
   background-position: left 0px top 50%;
   background-size: 40%;
   position: relative;
   height: 1024px;
}
.logo {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   margin: auto;
   max-width: 580px;
   height: auto;
}
.logo img {
   width: 100%;
   height: auto;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translateY(-50%) translateX(-50%);
 -webkit- transform: translateY(-50%) translateX(-50%);
}
.overview {
   position: absolute;
   overflow: hidden;
   bottom: 5%;
   left: 5%;
   width: 540px;
   height: auto;
}
.overview img {
   width: 100%;
   height: auto;
}
.overview2 {
   display: none;
}
}

@media screen and (min-width: 769px) and (max-width: 1279px) {
#mainv {
   height: 1024px;
   background-color: #8ad0c2;
   position: relative;
}
#bg1 {
   background-image: url(/af/06/img/bg_catain.png);
   background-repeat: no-repeat;
   background-position: right 20px top 0px;
   background-size: 45%;
   height: 1024px;
}
#bg2 {
   background-image: url(/af/06/img/bg_table.png);
   background-repeat: no-repeat;
   position: relative;
   background-position: right 0 bottom -10px;
   background-size: 45%;
   height: 1024px;
}
#bg3 {
   background-image: url(/af/06/img/bg_pasta.png);
   background-repeat: no-repeat;
   background-position: left 0px top 50%;
   background-size: 45%;
   position: relative;
   height: 1024px;
}
.logo {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   margin: auto;
   max-width: 580px;
   height: auto;
}
.logo img {
   width: 100%;
   height: auto;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translateY(-50%) translateX(-50%);
 -webkit- transform: translateY(-50%) translateX(-50%);
}
.overview {
   position: absolute;
   overflow: hidden;
   bottom: 10%;
   left: 6%;
   width: 400px;
   height: auto;
}
.overview img {
   width: 100%;
   height: auto;
}
.overview2 {
   display: none;
}
}

@media screen and (min-width: 415px) and (max-width: 768px) {
#mainv {
   height: 614px;
   position: relative;
   background: url(/af/06/img/main-768.png) no-repeat;
   background-size: cover;
   background-position: center center;
}
.logo img {
   display: none;
}
.overview {
   display: none;
}
.overview2 {
   display: block;
   position: absolute;
   overflow: hidden;
   bottom: 4%;
   left: 4%;
   width: 320px;
   height: auto;
}
.overview2 img {
   width: 100%;
   height: auto;
}
}



@media screen and (min-width: 361px) and (max-width: 414px) {
#mainv {
   height: 736px;
   position: relative;
   background: url(/af/06/img/main-360b.png) no-repeat;
   background-size: cover;
   background-position: center center;
}
.logo img {
   display: none;
}
.overview,
.overview2 {
   display: none;
}
/*.overview2 {
   display: block;
   position: absolute;
   overflow: hidden;
   bottom: 4%;
   left: 4%;
   width: 320px;
   height: auto;
}
.overview2 img {
   width: 100%;
   height: auto;
}*/
}
@media screen and (max-width: 375px) {
#mainv {
   height: 667px;
}
}

@media screen and (max-width: 360px) {
#mainv {
   height: 570px;
   background: url(/af/06/img/main-360.png) no-repeat;
   background-size: cover;
   background-position: center center;
}
.logo img {
   display: none;
}
.overview,.overview2 {
   display: none;
}
}
/*-----------------------------------------------------
intro
-----------------------------------------------------*/


#intro .container {
   width: 90%;
   max-width: 586px;
   margin-left: auto;
   margin-right: auto;
   margin-bottom: 184px;
}
h2.intro__title {
   font-size: 2.0rem;
   text-align: center;
   font-weight: bold;
   line-height: 1.75;
   margin-top: 100px;
   margin-bottom: 100px;
}
.intro__desc p {
   font-weight: normal;
   text-align: justify;
   text-justify: inter-ideograph;
   letter-spacing: -0.02em;
   line-height: 2;
}
p.intro__name {
   text-align: right;
   margin-top: 50px;
}

@media (max-width: 756px) {
#intro .container {
   margin-bottom: 100px;
   width: 100%;
   max-width: 100%;
}
h2.intro__title {
   font-size: 1.5rem;
   margin: 60px 0;
}
p.intro__name {
   text-align: right;
   margin-top: 30px;
}
}
/*-----------------------------------------------------
outline
-----------------------------------------------------*/

#outline .container {
   max-width: 824px;
   width: 90%;
   border: 3px solid #000;
   padding: 40px;
   margin-bottom: 184px;
}
h1.outline__title {
   font-size: 1.7rem;
   font-weight: bold;
   line-height: 1.8;
   margin: 0 0 20px;
}
h1.outline__title span {
   font-size: 2.5rem;
}
.outline__overview {
   font-size: 2.3rem;
   margin-bottom: 24px;
}
.outline__overview span {
   font-size: 1.7rem;
}
dl.outline__desc {
   font-size: 1.3rem;
   font-weight: normal;
   margin-bottom: 10px;
}
dl.outline__desc dt {
   float: left;
   font-weight: normal;
}
dl.outline__desc dt::after {
   content: "：";
}
dl.outline__desc dd span {
   font-size: 1.1rem;
}
dl.outline__sponsorship {
   font-size: 1.3rem;
   font-weight: normal;
   margin: 25px 0 0;
}
dl.outline__sponsorship dt, dl.outline__sponsorship dd {
   float: left;
   font-weight: normal;
   margin-bottom: 10px;
}
dl.outline__sponsorship dd {
   float: none;
}
dl.outline__sponsorship dt::after {
   content: "：";
}
.brpc {
   display: none;
}

@media (max-width: 756px) {
#outline .container {
   padding: 6%;
   margin-bottom: 100px;
}
h1.outline__title span {
   font-size: 2.0rem;
}
.outline__overview {
   font-size: 1.8rem;
}
.outline__overview span {
   font-size: 1.5rem;
}
.brpc {
   display: block;
}
}
/*-----------------------------------------------------
exhibit
-----------------------------------------------------*/


h3 {
   font-size: 10rem;
   font-weight: bold;
   text-align: center;
   margin-bottom: 140px;
}
h5.content__title {
   font-size: 2.3rem;
   font-weight: bold;
   text-align: center;
   margin-bottom: 25px;
}
.content__box {
   padding: 40px 0;
   border-top: 3px #000 solid;
   border-bottom: 3px #000 solid;
   margin-bottom: 180px;
}
.content__group {
   padding-bottom: 40px;
   border-bottom: #000000 2px dotted;
   margin-bottom: 40px;
   position: relative;
}
.content__group:last-child {
   border: none;
   margin-bottom: 0;
   padding-bottom: 0;
}
.content__group::after {
   content: "";
   display: block;
   clear: both;
}
h4 {
   font-weight: bold;
   font-size: 2.2rem;
   margin: 0 0 25px;
}
h4 span.midashi {
   display: inline-block;
   font-size: 3.4rem;
}
h4 span.sub {
   font-size: 1.7rem;
}
span.tag {
   font-size: 1.3rem;
   position: absolute;
   top: 0;
   right: 0;
   line-height: 1;
}
span.tag::before {
   content: "｜";
   margin-right: 10px;
}
span.tag::after {
   content: "｜";
   margin-left: 10px;
}
.content__desc span.content__desc__note {
   font-size: 1.1rem;
   font-weight: normal;
}
.content__area {
   max-width: 534px;
   width: 62%;
}
.content__thumb {
   width: 34%;
   max-width: 288px;
   padding-top: 70px;
}
.content__thumb2 {
   width: 34%;
   max-width: 288px;
   padding-top: 55px;
}
.content__thumb img, .content__thumb2 img {
   width: 100%;
   height: auto;
}
.floatleft {
   float: left;
}
.floatright {
   float: right;
}
.ws_overview {
   width: 100%;
   list-style: none;
   margin-bottom: 75px;
}
.ws_overview li {
   text-align: center;
   margin-bottom: 10px;
}
.ws_overview li span {
   font-size: 1.1rem;
}
.caption {
   margin-top: 5px;
   font-weight: normal;
   font-size: 0.9rem;
}

@media (max-width: 756px) {
h3 {
   font-size: 5.6rem;
   margin-bottom: 60px;
}
h5.content__title {
   font-size: 2.1rem;
}
.content__box {
   margin-bottom: 100px;
}
.content__area {
   width: 100%;
   max-width: 100%;
}
.content__thumb,  .content__thumb2 {
   width: 100%;
   max-width: 100%;
   padding-top: 20px;
}
.ws_overview {
   padding-left: 0;
}
.ws_overview li {
   text-align: left;
}
.floatleft, .floatright {
   float: none;
}
span.tag {
   display: block;
   font-size: 1.2rem;
   position: relative;
   line-height: 1.6;
   margin-bottom: 25px;
}
span.tag::before,  span.tag::after {
   content: none;
   margin: 0;
}
}
/*-----------------------------------------------------
event
-----------------------------------------------------*/
.event__title {
   font-size: 2.2rem;
   float: left;
   padding-right: 30px;
}
.event__desc {
   margin-left: 40%;
   word-wrap: break-word;
}
.event__desc span {
   font-size: 1.3rem;
   font-weight: normal;
}

@media (max-width: 756px) {
.event__title {
   float: none;
   font-size: 2rem;
}
.event__desc {
   margin: 15px 0 0;
}
}
/*-----------------------------------------------------
Access
-----------------------------------------------------*/


.content__left {
   float: left;
}
.content__right {
   float: right;
}
dl.access__info {
   margin: 0;
   font-weight: normal;
}
dl.access__info dt {
   float: none;
   font-weight: normal;
   margin-bottom: 5px;
}
dl.access__info dt:before {
   content: "◎";
   padding-right: 5px;
}
dl.access__info dd {
   float: none;
   margin-bottom: 5px;
   line-height: 1.65;
}
dl.access__info dd:before {
   content: "-";
   padding-right: 5px;
}
#map {
   max-width: 100%;
   min-width: 368px;
   margin: auto;
}
#map img {
   max-width: none;
}
#map_canvas {
   height: 300px;
   width: 100%;
}

@media (max-width: 993px) {
.google-maps2 {
   position: relative;
   padding-bottom: 65%;
   height: 0;
   overflow: hidden;
   margin-top: 30px;
}
.google-maps2 iframe, .google-maps2 object, .google-maps2 embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}
.content__left,  .content__right {
   float: none;
}
br.brsp {
   display: none;
}
}
/*-----------------------------------------------------
STAFF
-----------------------------------------------------*/

#staff .container {
   background: #eeefef;
   padding: 50px;
   width: 90%;
   margin-bottom: 180px;
}
.staff_title {
   font-weight: bold;
   text-align: center;
   font-size: 2.2rem;
   margin-bottom: 45px;
}
.flex_box {
   display: flex;
   -webkit-flex-wrap: nowrap;
   flex-wrap: nowrap;
   justify-content: center;
}
.flex {
   margin-right: 50px;
}
.flex:last-child {
   margin-right: 0;
}
ul.staff__list {
   list-style: none;
   font-weight: normal;
   margin-bottom: 48px;
   padding: 0;
}
ul.staff__list li.strong {
   font-weight: bold;
}
.toy img {
   width: 66px;
   margin-top: -30px;
}

@media (max-width: 756px) {
#staff .container {
   padding: 5%;
   margin-bottom: 100px;
}
.flex_box {
   display: block;
}
.flex {
   margin-right: 0px;
   margin-bottom: 20px;
}
ul.staff__list {
   margin-bottom: 20px;
}
.toy img {
   margin: 5px 0 25px;
}
}
/*-----------------------------------------------------
footer
-----------------------------------------------------*/

footer {
   background: #fff9e1;
   padding: 0;
   margin: 0;
   margin-top: 20px;
}
.footer_container {
   padding: 50px 0;
   overflow: hidden;
   position: relative;
   max-width: 884px;
   margin: 0 auto;
   width: 90%;
}
.contact {
   font-weight: normal;
   max-width: 450px;
   float: left;
}
ul.f_logo {
   list-style: none;
   float: right;
   margin-top: 40px;
}
ul.f_logo li {
   float: left;
   margin-right: 45px;
}
ul.f_logo li img {
   height: 30px;
   width: auto;
}
#back-top {
   position: fixed;
   bottom: 40px;
   right: 40px;
   z-index: 10000;
}
#back-top span {
   width: 52px;
   height: 52px;
   display: block;
}

@media (max-width: 756px) {
.footer_container {
   padding: 25px 0;
}
.contact {
   float: none;
   text-align: center;
}
ul.f_logo {
   float: none;
   padding: 0;
}
ul.f_logo li {
   float: none;
   margin-right: 0;
   margin-bottom: 25px;
   text-align: center;
}
ul.f_logo li img {
   height: 30px;
   width: auto;
   margin: 0 auto;
}
#back-top {
   position: fixed;
   bottom: 3%;
   right: 3%;
}
#back-top span {
   width: 52px;
   height: 52px;
   display: block;
}
}