@charset &quot;UTF-8&quot;;
/*-----------------------------------------------------	*/
/*	reset					*/
/*-----------------------------------------------------	*/
/* --HTML-- */
html {
  background: #fff;
  color: #343434;
  overflow-y: scroll;
}

/* --BODY-- */
body {
  margin: 0;
  overflow: visible;
  padding: 0;
}

/* for IE7 */
* + html body {
  /* font-family:&#039;メイリオ&#039;; */
}

/* --OTHER TAGS-- */
a img, fieldset, img {
  border: 0;
}

blockquote, dd, div, dl, dt, fieldset, form,
h1, h2, h3, h4, h5, h6, input, li, ol, p, pre,
select, span, textarea, td, th, ul {
  margin: 0;
  padding: 0;
}

abbr, acronym {
  border: 0;
}

address, caption, cite, code, dfn, em, th, strong, var {
  font-style: normal;
  font-weight: normal;
}

caption, th {
  text-align: left;
}

code, kbd, pre, samp, tt {
  font-family: monospace;
  line-height: 100%;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

input, select, textarea {
  font-family: &#039;Lucida Grande&#039;,Arial,Helvetica,Verdana,sans-serif;
}

ol, ul {
  list-style: none;
}

q:before, q:after {
  content: &#039;&#039;;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 100%;
}

img {
  vertical-align: middle;
}

body {
  font: 13px/1.231 Verdana,Arial,sans-serif;
  *font-size: small;
  *font: x-small;
}

/* select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;} */
table {
  font-size: inherit;
  font: 100%;
}

pre, code, kbd, samp, tt {
  font-family: monospace;
  *font-size: 108%;
  line-height: 1;
}

* html body {
  font-family: &#039;ＭＳ Ｐゴシック&#039;,sans-serif;
}

*:first-child + html body {
  font-family: &#039;ＭＳ Ｐゴシック&#039;,sans-serif;
}

a {
  text-decoration: none;
}

p, dt, dd {
  line-height: 1.7;
}

/* 10px = 77% 11px = 85% 12px = 93% 13px = 100%
14px = 108% 15px = 116% 16px = 123.1% 17px = 131%
18px = 138.5% 19px = 146.5% 20px = 153.9% 21px = 161.6%
22px = 167% 23px = 174% 24px = 182% 25px = 189% 26px = 197% */
.fs15 {
  font-size: 116%;
}

.mt10 {
  margin-top: 10px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mt40 {
  margin-top: 40px !important;
}

.mt50 {
  margin-top: 50px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb40 {
  margin-bottom: 40px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

@media screen and (max-width: 768px) {
  .align-c {
    text-align: center;
  }
}

@media screen and (max-width: 768px) {
  .align-r {
    text-align: right;
  }
}

@font-face {
  font-family: &#039;icomoon&#039;;
  src: url(&quot;../fonts/icomoon.eot?jwjdsb&quot;);
  src: url(&quot;../fonts/icomoon.eot?#iefixjwjdsb&quot;) format(&quot;embedded-opentype&quot;), url(&quot;../fonts/icomoon.woff?jwjdsb&quot;) format(&quot;woff&quot;), url(&quot;../fonts/icomoon.ttf?jwjdsb&quot;) format(&quot;truetype&quot;), url(&quot;../fonts/icomoon.svg?jwjdsb#icomoon&quot;) format(&quot;svg&quot;);
  font-weight: normal;
  font-style: normal;
}

[class^=&quot;icomoon-&quot;], [class*=&quot; icomoon-&quot;] {
  font-family: &#039;icomoon&#039;;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icomoon-arrow:before {
  content: &quot;\e601&quot;;
}

.icomoon-cart:before {
  content: &quot;\e600&quot;;
}

/*---------------------
	common
--------------------- */
@media screen and (max-width: 767px) {
  #flips_header_ad {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  #header .header-inner {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  #header .header-inner {
    width: 90%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  #header .header-inner #top_text h1 {
    padding-top: 30px;
  }
}
@media screen and (max-width: 767px) and (max-width: 768px) {
  #header .header-inner #top_text h1 {
    width: 100%;
    float: none;
  }
}
@media screen and (max-width: 767px) {
  #header .header-inner #link {
    width: 100%;
    height: 0;
    display: none;
  }
}
@media screen and (max-width: 767px) {
  #header .header-inner #logo {
    padding: 20px 0 15px;
    font-size: 189%;
  }
}

@media screen and (max-width: 767px) {
  #navigation {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  .visual-wrapper {
    margin-bottom: 20px;
  }
}

@media screen and (max-width: 768px) {
  #visual {
    width: 100% !important;
    /* 		height: 100% !important; */
    margin-bottom: 0px;
    padding: 0 0;
  }

  #visual_skitter {
    width: 100% !important;
    height: 100% !important;
  }
  #visual_skitter img {
    width: 100% !important;
    height: 100% !important;
  }
  #visual_skitter .container_skitter {
    width: 100% !important;
    height: 100% !important;
  }
}
@media screen and (max-width: 767px) {
  .page-wrapper {
    padding: 10px 0;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  .page-wrapper #page_title {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .page-wrapper #page_title {
    font-size: 215.4%;
  }
}

@media screen and (max-width: 767px) {
  #container {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  #container #contents {
    width: 100%;
    float: none;
  }
}
#container #contents .module {
  margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
  #container #contents .module h3 {
    padding: 0 15px 10px;
    font-size: 167% !important;
  }
}
@media screen and (max-width: 767px) {
  #container #contents .module h4 {
    padding: 0 15px 10px;
    font-size: 138.5% !important;
  }
}
@media screen and (max-width: 767px) {
  #container #contents .module .text {
    padding: 0 15px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  #container #contents .module .article {
    padding: 0 15px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  #container #contents .module .image_list {
    padding: 0 15px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  #container #contents .module .rss {
    padding: 0 15px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  #container #contents .module ol {
    padding: 0 15px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  #container #contents .module .sitemap {
    padding: 0 15px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  #container #contents .module .map {
    padding: 0 15px;
    margin-bottom: 30px;
  }
}
@media screen and (max-width: 768px) {
  #container #side {
    width: 100%;
    float: none;
  }
}
@media screen and (max-width: 767px) {
  #container #side .module h3 {
    padding: 0 15px 10px;
  }
}
@media screen and (max-width: 767px) {
  #container #side .module h4 {
    padding: 0 15px 10px;
  }
}
@media screen and (max-width: 767px) {
  #container #side .module .text {
    padding: 0 15px;
  }
}
@media screen and (max-width: 767px) {
  #container #side .module .article {
    padding: 0 15px;
  }
}
@media screen and (max-width: 767px) {
  #container #side .module .image_list {
    padding: 0 15px;
  }
}
@media screen and (max-width: 767px) {
  #container #side .module .map {
    padding: 0 15px;
  }
}
@media screen and (max-width: 767px) {
  #container #side .module .rss {
    padding: 0 15px;
  }
}
@media screen and (max-width: 767px) {
  #container #side .module ol {
    padding: 0 15px;
  }
}
@media screen and (max-width: 767px) {
  #container #side .module .sitemap {
    padding: 0 15px;
  }
}
@media screen and (min-width: 768px) {
  #container .pageTop {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  #footer ul {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  #footer ul {
    border-top: 1px solid #ccc;
    padding: 0;
    background: #eee;
  }
  #footer ul li {
    display: block;
    border-bottom: 1px solid #ccc;
    padding: 0;
    border-right: 0;
  }
  #footer ul a {
    display: block;
    font-weight: bold;
    padding: 15px 10px;
    background: url(http://assets.flips.jp/images/common/design/31066/images/arrow_list_sp.png) no-repeat 98% center;
    background-size: 13px 20px;
    text-align: left;
  }
  #footer ul a:hover {
    background: #333333 url(http://assets.flips.jp/images/common/design/31066/images/arrow_list_sp.png) no-repeat right center;
    background-size: 13px 20px;
  }
}

@media screen and (max-width: 767px) {
  #go_to_top {
    display: none;
  }
}
