@charset "UTF-8";
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document ========================================================================== */
/** 1. Correct the line height in all browsers. 2. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS. */
@import "https://cdn.jsdelivr.net/fontawesome/4.7.0/css/font-awesome.min.css";
html { line-height: 1.15; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ }

/* Sections ========================================================================== */
/** Remove the margin in all browsers (opinionated). */
body { margin: 0; }

/** Add the correct display in IE 9-. */
article, aside, footer, header, nav, section { display: block; }

/** Correct the font size and margin on `h1` elements within `section` and `article` contexts in Chrome, Firefox, and Safari. */
h1 { font-size: 2em; margin: 0.67em 0; }

/* Grouping content ========================================================================== */
/** Add the correct display in IE 9-. 1. Add the correct display in IE. */
figcaption, figure, main { /* 1 */ display: block; }

/** Add the correct margin in IE 8. */
figure { margin: 1em 40px; }

/** 1. Add the correct box sizing in Firefox. 2. Show the overflow in Edge and IE. */
hr { -webkit-box-sizing: content-box; box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ }

/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }

/* Text-level semantics ========================================================================== */
/** 1. Remove the gray background on active links in IE 10. 2. Remove gaps in links underline in iOS 8+ and Safari 8+. */
a { background-color: transparent; /* 1 */ -webkit-text-decoration-skip: objects; /* 2 */ }

/** 1. Remove the bottom border in Chrome 57- and Firefox 39-. 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */
abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ }

/** Prevent the duplicate application of `bolder` by the next rule in Safari 6. */
b, strong { font-weight: inherit; }

/** Add the correct font weight in Chrome, Edge, and Safari. */
b, strong { font-weight: bolder; }

/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }

/** Add the correct font style in Android 4.3-. */
dfn { font-style: italic; }

/** Add the correct background and color in IE 9-. */
mark { background-color: #ff0; color: #000; }

/** Add the correct font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` elements from affecting the line height in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sub { bottom: -0.25em; }

sup { top: -0.5em; }

/* Embedded content ========================================================================== */
/** Add the correct display in IE 9-. */
audio, video { display: inline-block; }

/** Add the correct display in iOS 4-7. */
audio:not([controls]) { display: none; height: 0; }

/** Remove the border on images inside links in IE 10-. */
img { border-style: none; }

/** Hide the overflow in IE. */
svg:not(:root) { overflow: hidden; }

/* Forms ========================================================================== */
/** 1. Change the font styles in all browsers (opinionated). 2. Remove the margin in Firefox and Safari. */
button, input, optgroup, select, textarea { font-family: sans-serif; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ }

/** Show the overflow in IE. 1. Show the overflow in Edge. */
button, input { /* 1 */ overflow: visible; }

/** Remove the inheritance of text transform in Edge, Firefox, and IE. 1. Remove the inheritance of text transform in Firefox. */
button, select { /* 1 */ text-transform: none; }

/** 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` controls in Android 4. 2. Correct the inability to style clickable types in iOS and Safari. */
button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; /* 2 */ }

/** Remove the inner border and padding in Firefox. */
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; }

/** Restore the focus styles unset by the previous rule. */
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; }

/** Correct the padding in Firefox. */
fieldset { padding: 0.35em 0.75em 0.625em; }

/** 1. Correct the text wrapping in Edge and IE. 2. Correct the color inheritance from `fieldset` elements in IE. 3. Remove the padding so developers are not caught out when they zero out `fieldset` elements in all browsers. */
legend { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ }

/** 1. Add the correct display in IE 9-. 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. */
progress { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ }

/** Remove the default vertical scrollbar in IE. */
textarea { overflow: auto; }

/** 1. Add the correct box sizing in IE 10-. 2. Remove the padding in IE 10-. */
[type="checkbox"], [type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }

/** Correct the cursor style of increment and decrement buttons in Chrome. */
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }

/** 1. Correct the odd appearance in Chrome and Safari. 2. Correct the outline style in Safari. */
[type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ }

/** Remove the inner padding and cancel buttons in Chrome and Safari on macOS. */
[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** 1. Correct the inability to style clickable types in iOS and Safari. 2. Change font properties to `inherit` in Safari. */
::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }

/* Interactive ========================================================================== */
/* Add the correct display in IE 9-. 1. Add the correct display in Edge, IE, and Firefox. */
details, menu { display: block; }

/* Add the correct display in all browsers. */
summary { display: list-item; }

/* Scripting ========================================================================== */
/** Add the correct display in IE 9-. */
canvas { display: inline-block; }

/** Add the correct display in IE. */
template { display: none; }

/* Hidden ========================================================================== */
/** Add the correct display in IE 10-. */
[hidden] { display: none; }

/**************************************************
　base
***************************************************/
/* -----------------------------------------------
　Body
-------------------------------------------------- */
html { -webkit-font-smoothing: antialiased; }

html, body { width: 100%; }

body { min-width: 1000px; margin: 0; padding: 0; background: #fff; color: #40220f; line-height: 1.6; }

body, input, textarea, select { font-size: 14px; font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic Pro W3", "メイリオ", Meiryo, Helvetica, sans-serif; }

/* -----------------------------------------------
　Elements
-------------------------------------------------- */
h1, h2, h3, h4, h5, h6, ul, li, dl, dt, dd { margin: 0; padding: 0; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; line-height: 1.4; }

ol { margin-top: 0; margin-bottom: 0; padding-left: 2em; }

ol li { list-style: decimal; }

ul li { list-style: none; }

img, video { border: 0; vertical-align: bottom; }

a { color: #40220f; text-decoration: none; -webkit-transition: opacity 0.5s ease-out; -o-transition: opacity 0.5s ease-out; transition: opacity 0.5s ease-out; }

a:hover { text-decoration: underline; opacity: 0.7; }

p { margin: 0; padding: 0; }

em { font-style: normal; }

/* -----------------------------------------------
　Common Class
-------------------------------------------------- */
.wrap, .page-content { zoom: 1; }

.wrap:after, .page-content:after { content: ''; display: block; clear: both; overflow: auto; }

.float-l { float: left; }

.float-r { float: right; }

.clear { clear: both; }

.hidden { display: none; }

.center { text-align: center; }

.right { text-align: right; }

.left { text-align: left; }

.wordbreak { word-break: break-all !important; }

.nowrap { white-space: nowrap !important; }

.red { color: #f00; }

p.indention, ul.indention li { margin-left: 1em; text-indent: -1em; }

ul.indention .noindent { margin-left: 0; text-indent: 0; }

ol.decimal li { list-style: decimal; }

.caps { text-transform: uppercase; }

.capsoff { text-transform: none !important; }

.disp-ib { display: inline-block; }

.disp-tb, .view-tb, .disp-tbsp, .view-tbsp, .disp-sp, .view-sp, .view-sp2, .imgTxt span { display: none; }

.disp-pc { display: block; }

.view-pc, .view-pc2, .imgTxt img { display: inline; }

/**************************************************
　structure
***************************************************/
img { user-select: none; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; -khtml-user-select: none; -webkit-user-drag: none; -khtml-user-drag: none; -webkit-touch-callout: none; }

/* -----------------------------------------------
　Header
-------------------------------------------------- */
#site-header { position: absolute; top: 0; width: 100%; height: 78px; z-index: 100; -webkit-transition: background 0.5s ease-out; -o-transition: background 0.5s ease-out; transition: background 0.5s ease-out; }

#home #site-header { background: #fff; }

#site-header .header-inner { position: fixed; top: 0; width: 100%; }

.header-logo { position: absolute; top: 26px; left: 30px; }

.back-btn { position: absolute; top: 22px; right: 92px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; z-index: 100; }

#home .back-btn { display: none; }

.gnav-btn { position: absolute; top: 25px; right: 30px; width: 32px; height: 28px; cursor: pointer; z-index: 100; }

.gnav-btn .hb { top: 0; left: 0px; }

.gnav-btn .hb, .gnav-btn .hb::before, .gnav-btn .hb::after { display: block; content: ""; position: absolute; width: 32px; height: 4px; background: #40220f; border-radius: 1px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }

.gnav-btn .hb::before { top: 12px; left: 0; }

.gnav-btn .hb::after { top: 24px; left: 0; }

#global-nav { position: fixed; top: 0; right: 10px; width: 240px; z-index: 90; -webkit-transform: translateY(-50px); -ms-transform: translateY(-50px); transform: translateY(-50px); -webkit-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; opacity: 0; visibility: hidden; }

#global-nav .gnav { padding: 108px 30px 40px; background: rgba(255, 255, 255, 0.8); -webkit-box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.15); box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.15); }

#global-nav .gnav > li + li { margin-top: 40px; }

#global-nav.is-open { display: block; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; visibility: visible; }

/* -----------------------------------------------
　Footer
-------------------------------------------------- */
#site-footer .footer-inner { width: 1000px; margin-right: auto; margin-left: auto; padding: 20px 0; background: url(../img/bg-texture.png) repeat; }

#site-footer .copyright { font-size: 85.71429%; line-height: 1; text-align: center; }

.sns-nav { text-align: center; }

.sns-nav a { display: inline-block; margin: 0 20px; }

.footer-nav { width: 580px; margin: 80px auto 60px; zoom: 1; }

.footer-nav:after { content: ''; display: block; clear: both; overflow: auto; }

.footer-nav > li { float: left; display: block; width: 240px; margin: 0 25px; text-align: center; letter-spacing: 0.1em; text-indent: 0.1em; }

.footer-nav a { display: block; padding: 5px; background: #a48b78; color: #FFFFFF; text-decoration: none; }

/* -----------------------------------------------
　Content
-------------------------------------------------- */
#inbox { position: relative; width: 100%; margin: auto; overflow: hidden; }

#site-container { position: relative; }

.inner { position: relative; margin: 0 auto; padding-left: 70px; padding-right: 70px; }

.inner2 { position: relative; margin: 0 auto; padding-left: 100px; padding-right: 100px; }

.page-content { position: relative; width: 1000px; margin-right: auto; margin-left: auto; padding: 20px 0; background: url(../img/bg-texture.png) repeat; }

/**************************************************
　unique
***************************************************/
body { overflow-y: scroll; }

.page-title { text-align: center; }

.header-a { text-align: center; line-height: 1; }

.header-a .bdr-bottom { display: inline-block; padding: 10px; border-bottom: 4px solid #40220f; }

.intro { margin-top: 40px; text-align: center; }

.sound-balloon { position: absolute; bottom: 34px; left: -55px; }

.sound-btn { width: 35px; height: 25px; cursor: pointer; text-align: right; background: url(../../images/img-sound2.png) top left no-repeat; background-size: 35px; }

.clicked { background-image: url(../../images/img-mute2.png); }

.top-sound { position: absolute; bottom: 25px; right: 30px; z-index: 50; text-align: right; }

.top-sound .sound-balloon { left: -65px; }

.top-sound .sound-btn { background-image: url(../../images/img-sound.png); }

.top-sound .clicked { background-image: url(../../images/img-mute.png); }

.l-sound { position: absolute; bottom: 30px; right: 70px; }

.slider-sound { position: fixed; bottom: 25px; right: 30px; z-index: 103; }

.slider-sound .sound-balloon { left: -70px; }

/* -----------------------------------------------
　トップ
-------------------------------------------------- */
#home .page-content { padding: 80px 0; }

.main-visual { position: relative; }

.main-visual .title { position: absolute; top: 17%; left: 50%; margin-left: -193px; z-index: 50; }

.main-visual .swiper-slide img { width: 100%; height: auto; }

.main-visual .slide1 img, .main-visual .slide2 img { margin: -10% 0; }

.main-visual .slide3 img { margin: -20% 0 0; }

.top-select { margin: 40px -50px 100px; zoom: 1; }

.top-select:after { content: ''; display: block; clear: both; overflow: auto; }

.top-select > li { float: left; position: relative; margin: 0 50px; border: 10px solid #fff; -webkit-box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.2); box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.2); }

.top-select > li a { display: block; }

.top-select > li a:hover { opacity: 1; }

.top-select > li a::after { display: block; content: ""; top: 0; left: 0; position: absolute; width: 100%; height: 100%; z-index: 10; -webkit-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; }

.top-select > li.udonken a::after { background: url(../../images/home/layer-udonken.png) no-repeat center; }

.top-select > li.udonken a:hover::after { background-color: rgba(64, 34, 15, 0.5); }

.top-select > li.artken a::after { background: url(../../images/home/layer-artken.png) no-repeat center; }

.top-select > li.artken a:hover::after { background-color: rgba(64, 34, 15, 0.5); }

.top-gallery { margin: 40px -22px; zoom: 1; }

.top-gallery:after { content: ''; display: block; clear: both; overflow: auto; }

.top-gallery > li { float: left; margin: 0 22px; }

.top-gallery > li img { -webkit-box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.2); box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.2); }

.gallery-more { text-align: center; }

.music-record { position: absolute; margin-bottom: -100px; right: 56px; }

.music-record .record { position: absolute; top: 22px; left: -110px; -webkit-animation: spin 3s linear infinite; animation: spin 3s linear infinite; }

.music-record .txt { position: absolute; top: 0; left: 0; }

.music-record a:hover { opacity: 1; }

.music-record .txt img { -webkit-transition: -webkit-transform 0.2s ease-out; transition: -webkit-transform 0.2s ease-out; -o-transition: transform 0.2s ease-out; transition: transform 0.2s ease-out; transition: transform 0.2s ease-out, -webkit-transform 0.2s ease-out; }

.music-record:hover .txt img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); }

@-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

@keyframes spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

@media screen and (max-width: 640px) { .music-record { display: none; } }

/* -----------------------------------------------
　うどん県 アート県
-------------------------------------------------- */
.image-visual { height: 662px; text-align: center; background: url(../../udon/images/image-visual.jpg) no-repeat center; background-size: cover; }

#art .image-visual { background-image: url(../../art/images/image-visual.jpg); }

.column-archive { margin: 40px -20px 80px; zoom: 1; }

.column-archive:after { content: ''; display: block; clear: both; overflow: auto; }

.column-archive > .unit { float: left; width: 270px; margin: 0 15px; text-align: center; }

.column-archive .title { margin: 12px auto; }

.column-archive .title2 { display: block; margin: 12px auto; }

.column-archive.onlytwo { margin-left: auto; margin-right: auto; max-width: 600px; }

.column-archive .image { display: inline-block; position: relative; }

.column-archive .image a:after { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: no-repeat center; background-size: 45px 39px; z-index: 10; content: ""; }

.column-archive .image a:hover { opacity: 1; }

.column-archive .image a:hover:after { background-image: url(../../images/layer-play.png); }

.btn-language { width: 178px; margin: 0 auto; zoom: 1; }

.btn-language:after { content: ''; display: block; clear: both; overflow: auto; }

.btn-language > li { float: left; margin: 6px; border: 1px solid #40220f; line-height: 1; }

.content-nav { margin: 80px auto; text-align: center; line-height: 1; }

.content-nav > span { display: inline-block; margin: 0 35px; text-align: center; }

.content-nav a { display: block; width: 280px; padding: 8px 0; background: #fff; border-radius: 20px; }

.udonken-cast .cast { margin: 0 30px 50px; padding: 25px; background: #fff; }

.udonken-cast .cast .float-r { width: 550px; }

.udonken-cast .music { margin: 60px 80px; padding: 25px; background: #fff; }

.udonken-cast .music .float-r { width: 460px; }

.udonken-cast .cafe { margin-bottom: 8px; line-height: 1; }

.udonken-cast .name { margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px dashed #b28146; font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", serif; font-size: 114.28571%; color: #595757; line-height: 1.2; font-weight: bold; letter-spacing: 0.1em; }

.udonken-cast .role { display: inline-block; margin-right: 1em; }

.udonken-cast .role img { vertical-align: middle; }

.udonken-cast .txt { font-size: 85.71429%; }

/* -----------------------------------------------
　ギャラリー
-------------------------------------------------- */
#gallery .page-title { padding: 46px 0 88px; }

.inner-g { position: relative; padding: 0 4.7% 40px; }

.l-gallery { zoom: 1; margin: 64px 0 0; }

.l-gallery:after { content: ''; display: block; clear: both; overflow: auto; }

.l-gallery > li { float: left; width: 33.33333%; margin: 0; padding: 0 3.20088% 7.06402%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; }

.l-gallery > li img { -webkit-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2); box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2); cursor: pointer; -webkit-transition: opacity 0.5s ease-out; -o-transition: opacity 0.5s ease-out; transition: opacity 0.5s ease-out; }

.l-gallery > li img:hover { opacity: 0.7; }

.modalwindow { display: none; /*overflow: auto;*/ position: fixed; top: 0; left: 0; z-index: 101; width: 100%; height: 100%; background: rgba(245, 242, 223, 0.88); cursor: pointer; opacity: 1; }

.close_modal { position: absolute; top: 18px; right: 26px; cursor: pointer; z-index: 103; }

.close_modal .cross { display: block; position: relative; width: 40px; height: 40px; background: rgba(245, 242, 223, 0.8); }

.close_modal .cross::before, .close_modal .cross::after { display: block; content: ""; position: absolute; top: 50%; width: 40px; height: 2px; border-radius: 1px; background: #40220f; }

.close_modal .cross::before { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

.close_modal .cross::after { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }

.modal_content { position: fixed; width: 90%; margin: 0 auto; border: 1px solid #ccc; z-index: 102; max-width: 1000px; }

.modal_content img { max-width: 100%; height: auto; }

/* -----------------------------------------------
　music
-------------------------------------------------- */
#music { background: url(../img/bg-texture.png) repeat center 0; }

#music #site-container { padding: 100px 0 0; }

#music #site-footer .footer-inner { background-image: none; }

#music .page-content { width: auto; max-width: 911px; min-height: 1121px; margin: 0 auto; padding: 50px 20px 50px 30px; background: url(../../images/music/bg-page.png) no-repeat center 0; }

#music .inner-m { max-width: 540px; margin: 0 auto; }

#music .page-title img { width: 192px; }

#music .header-a { margin: 28px 0 55px; }

#music .song { text-align: center; }

#music .song .text { display: inline-block; text-align: left; }

#music .song .uta { margin: 30px 0 0; line-height: 1.51; }

#music .udonken-cast .music { margin: 36px 0 0; padding: 20px 22px 22px; }

#music .udonken-cast .music .float-r { width: 380px; }

#music .udonken-cast .music .name { margin-bottom: 8px; padding-bottom: 0; border: 0; font-size: 0; }

#music .udonken-cast .music .txt { font-size: 71.42857%; line-height: 1.4; }

#music .udonken-cast .music .comment { margin-bottom: 2px; font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", serif; font-size: 78.57143%; line-height: 1.75; letter-spacing: 0.05em; }

#music .udonken-cast .music .musician { margin-bottom: 16px; padding-bottom: 8px; border-bottom: 1px dashed #b28146; font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", serif; color: #595757; font-size: 92.85714%; font-weight: bold; text-align: right; letter-spacing: 0.1em; }

/* -----------------------------------------------
　press
-------------------------------------------------- */
.header-press { position: relative; margin: 0; padding-top: 79.5%; background: url(../../press/images/mainvisual.jpg) no-repeat center; background-size: cover; }

.header-press .head-box { position: absolute; top: 5.33333%; right: 0; left: 0; width: 100%; text-align: center; }

.header-press .title { margin-top: 6.66667%; }

.l-press-movie ul { zoom: 1; max-width: 584px; margin: 38px auto 16px; }

.l-press-movie ul:after { content: ''; display: block; clear: both; overflow: auto; }

.l-press-movie li { float: left; width: 50%; padding: 0 0 44px; line-height: 1; text-align: center; }

.l-press-movie li a { display: inline-block; padding: 0 10px; }

.l-press-movie .ken { margin: 13px 0 12px; }

.l-press-poster ul { zoom: 1; max-width: 644px; margin: 38px auto 30px; }

.l-press-poster ul:after { content: ''; display: block; clear: both; overflow: auto; }

.l-press-poster li { float: left; width: 50%; padding: 0 0 48px; line-height: 1; text-align: center; }

.l-press-poster li a { display: inline-block; padding: 0 10px; }

.l-press-poster .ken { margin: 13px 0 12px; }

.l-press-poster .ken.art { margin-bottom: 13px; }

.l-press-logo ul { zoom: 1; margin: 48px auto 90px; }

.l-press-logo ul:after { content: ''; display: block; clear: both; overflow: auto; }

.l-press-logo li { float: left; width: 33.3%; line-height: 1; text-align: center; }

.l-press-logo .file { padding: 0 10px; }

.l-press-logo .file > dt { margin-bottom: 48px; }

.l-press-logo .file > dd { margin-top: 12px; }

.footer-press { padding: 0 0 25px; text-align: center; }

/**************************************************
　animation
***************************************************/
.fadeIn, .fadeInUp, .fadeInDown, .fadeInLeft, .fadeInRight { opacity: 0; -webkit-transition: all .5s ease-in-out .1s; -o-transition: all .5s ease-in-out .1s; transition: all .5s ease-in-out .1s; }

.fadeIn.is-disp, .fadeInUp.is-disp, .fadeInDown.is-disp, .fadeInLeft.is-disp, .fadeInRight.is-disp { opacity: 1; -webkit-transform: translate(0); -ms-transform: translate(0); transform: translate(0); }

.fadeInUp { -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); }

.fadeInDown { -webkit-transform: translateY(-100px); -ms-transform: translateY(-100px); transform: translateY(-100px); }

.fadeInLeft { -webkit-transform: translatex(-100px); -ms-transform: translatex(-100px); transform: translatex(-100px); }

.fadeInRight { -webkit-transform: translatex(100px); -ms-transform: translatex(100px); transform: translatex(100px); }

.delay1 { -webkit-transition-delay: 0.1s; -o-transition-delay: 0.1s; transition-delay: 0.1s; }

.delay2 { -webkit-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; }

.delay3 { -webkit-transition-delay: 0.3s; -o-transition-delay: 0.3s; transition-delay: 0.3s; }

.delay4 { -webkit-transition-delay: 0.4s; -o-transition-delay: 0.4s; transition-delay: 0.4s; }

.delay5 { -webkit-transition-delay: 0.5s; -o-transition-delay: 0.5s; transition-delay: 0.5s; }

.delay6 { -webkit-transition-delay: 0.6s; -o-transition-delay: 0.6s; transition-delay: 0.6s; }

.delay7 { -webkit-transition-delay: 0.7s; -o-transition-delay: 0.7s; transition-delay: 0.7s; }

.delay8 { -webkit-transition-delay: 0.8s; -o-transition-delay: 0.8s; transition-delay: 0.8s; }

.delay9 { -webkit-transition-delay: 0.9s; -o-transition-delay: 0.9s; transition-delay: 0.9s; }

.delay10 { -webkit-transition-delay: 1.0s; -o-transition-delay: 1.0s; transition-delay: 1.0s; }

.triangle3 { -webkit-animation: move-rotate 30s infinite linear; animation: move-rotate 30s infinite linear; }

@-webkit-keyframes move-rotate { 0% { -webkit-transform: rotate(0); transform: rotate(0); }
  50% { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

@keyframes move-rotate { 0% { -webkit-transform: rotate(0); transform: rotate(0); }
  50% { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

/* -----------------------------------------------
　sp
-------------------------------------------------- */
/**************************************************
　smartphone
***************************************************/
.disp-sp, .view-sp, .view-sp2, .imgTxt span { display: none; }

.disp-pc { display: block; }

.view-pc, .view-pc2, .imgTxt img { display: inline; }

@media screen and (max-width: 999px) { #gallery img, #press img, #music img { max-width: 100%; height: auto; }
  #gallery .page-content, #press .page-content, #music .page-content { width: auto; } }

@media screen and (max-width: 959px) { #music { min-width: 320px; }
  #music #site-container { padding: 70px 0 0; }
  #music .page-content { min-height: 200px; padding-bottom: 160px !important; background-position: 0 0; background-size: cover; }
  .l-sound { right: 45px; bottom: 35px; } }

@media screen and (max-width: 768px) { #music .page-content { padding: 46px 20px 50px 50px; }
  #music .udonken-cast .music { margin-left: 10px; padding: 15px; }
  #music .udonken-cast .music .float-l { float: none; text-align: center; margin-bottom: 10px; }
  #music .udonken-cast .music .float-r { width: auto; } }

@media screen and (max-width: 640px) { body { min-width: 320px; }
  .disp-pc, .view-pc, .imgTxt img { display: none !important; }
  .disp-sp { display: block; }
  .view-sp, .imgTxt span { display: inline; }
  .float-l { float: none; width: auto !important; }
  .float-r { float: none; width: auto !important; }
  * { -webkit-box-sizing: border-box; box-sizing: border-box; }
  img { max-width: 100%; height: auto; }
  a:hover { opacity: 1; }
  #site-header { height: 48px; }
  #site-header .header-logo { top: 12px; left: 12px; }
  .back-btn { top: 10px; right: 54px; width: 22px; }
  .gnav-btn { top: 15px; right: 15px; width: 24px; height: 18px; }
  .gnav-btn .hb { top: 0; left: 0px; }
  .gnav-btn .hb, .gnav-btn .hb::before, .gnav-btn .hb::after { width: 24px; height: 2px; }
  .gnav-btn .hb::before { top: 8px; left: 0; }
  .gnav-btn .hb::after { top: 16px; left: 0; }
  #global-nav { right: 6px; width: 220px; }
  #global-nav .gnav { padding: 54px 20px 30px; background: rgba(255, 255, 255, 0.9); }
  #global-nav .gnav > li + li { margin-top: 18px; }
  #site-footer .footer-inner { width: auto; padding: 20px 10px; }
  #site-footer .copyright { font-size: 71.42857%; }
  .sns-nav a { display: inline-block; margin: 0 20px; }
  .footer-nav { width: 480px; margin: 40px auto 20px; }
  .footer-nav > li { width: 220px; margin: 0 5px; }
  .inner, .inner2 { padding-left: 20px; padding-right: 20px; }
  .page-content { width: auto; padding: 48px 0 20px; }
  .page-title img { width: 121px; }
  .header-a .bdr-bottom { border-bottom-width: 3px; }
  .intro { margin-top: 20px; }
  #home .page-content { padding: 20px 0; }
  .main-visual .title { top: 75px; left: 0; width: 100%; margin: auto; text-align: center; }
  .main-visual .title img { width: 35%; }
  .main-visual .slide1 img, .main-visual .slide2 img, .main-visual .slide3 img { margin: 0; }
  .top-select { margin: 20px -2% 50px; }
  .top-select > li { width: 46%; margin: 0 2%; border: 4px solid #fff; }
  .top-select > li.udonken a::after, .top-select > li.artken a::after { background-size: 64%; }
  .top-gallery { margin: 20px -2% 0; }
  .top-gallery > li { width: 46%; margin: 0 2% 20px; text-align: center; }
  .gallery-more { text-align: center; }
  .top-sound { bottom: 15px; right: 5px; }
  .top-sound .sound-balloon { bottom: 28px; left: -55px; }
  .top-sound .sound-btn { margin-right: 10px; }
  .image-visual { height: auto; padding-bottom: 55%; }
  .column-archive { margin: 20px auto; }
  .column-archive > .unit { float: none; width: auto; margin: 0 auto 20px; }
  .column-archive .title { margin: 8px auto 4px; }
  .content-nav { margin: 20px auto 40px; }
  .content-nav > span { margin: 8px; }
  .udonken-cast .cast { margin: 0 auto 20px; padding: 15px; }
  .udonken-cast .cast .float-l { text-align: center; margin-bottom: 10px; }
  .udonken-cast .cast .float-r { width: auto; }
  .udonken-cast .music { margin: 20px auto; padding: 15px; }
  .udonken-cast .music .float-l { text-align: center; margin-bottom: 10px; }
  .udonken-cast .music .float-r { width: auto; }
  .udonken-cast .cafe { margin-bottom: 4px; }
  .udonken-cast .name { padding-bottom: 6px; }
  .udonken-cast .role { padding: 4px 0; }
  #gallery .page-title { padding: 23px 0 44px; }
  #gallery .page-title img { width: 118px; }
  .l-gallery > li img { -webkit-box-shadow: 4px 4px 6px rgba(0, 0, 0, 0.2); box-shadow: 4px 4px 6px rgba(0, 0, 0, 0.2); }
  .close_modal { top: 10px; right: 12px; }
  .close_modal .cross { width: 30px; height: 30px; }
  .close_modal .cross::before, .close_modal .cross::after { width: 30px; }
  .slider-sound { right: 15px; }
  #music #site-container { padding: 40px 0 0; }
  #music .page-title img { width: 118px; }
  #music .header-a { margin: 34px 0 44px; }
  #music .song { padding: 0 0 0 20px; }
  #music .song img { width: 200px; }
  #music .song .uta { font-size: 85.71429%; }
  #music .udonken-cast .music .name { text-align: center; }
  #music .udonken-cast .music .musician { font-size: 85.71429%; }
  /* -----------------------------------------------
　press
-------------------------------------------------- */
  .header-press .head-box { width: 38%; margin: auto; } }

@media screen and (max-width: 480px) { .view-pc2 { display: none; }
  .view-sp2 { display: inline; }
  .footer-nav { width: auto; }
  .footer-nav > li { float: none; margin-bottom: 15px; width: auto; } }