@charset "utf-8";

/*
 * ==============================================
 * ■基本設定
 * ==============================================
 */
 
*, *:before, *:after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  outline: 0;
  font-size: 100%;
  font-weight:normal;
  vertical-align: baseline;
  background: transparent;
  letter-spacing: 0.5px;
}

html, body{
  height:100%;
}

html {
  font-size: 62.5%;
  -webkit-font-smoothing: antialiased;
}

body {
 font: inherit;
 word-wrap:break-word;
 overflow-wrap:break-word;
 -webkit-text-size-adjust:100%;
}


ol, ul{
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

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

b{
    font-weight:bold;
}
strong{
    font-weight:bold;
}
i{
    font-style: italic;
}

img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  max-width:100%;
  height:auto;
  width /***/:auto; /* IE 8 */
}
img[src$=".svg"] {
  width: 100%;
  height: auto;
}
a:hover img {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{
  display: block;
}
figure{
    overflow: hidden;
    display: inline-block;
    position: relative;
    width: 100%;
    vertical-align: bottom;
}
figure img{
    width: 100%;
    vertical-align: bottom;
}

blockquote:before, blockquote:after,q:before, q:after {
  content: '';
  content: none;
}

blockquote, q { quotes: none; }
.clear { clear:both; }
.nowrap { white-space: nowrap; }

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

th,td {
  font-weight: normal;
  text-align: left;
  word-wrap:break-word;
}

dt,dd{
  word-wrap:break-word;
}

a {
  text-decoration: none;
  outline:none;
  word-break : break-all;
}
p a:hover {
  text-decoration: underline;
}

.cf:after {
  content: "";
  clear: both;
  display: block;
}

audio,canvas,progress,video {
  display: inline-block;
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}

main div{
    display: block;
    position: relative;
}
header div{
    display: block;
    position: relative;
}
footer div{
    display: block;
    position: relative;
}

/*
 * ==============================================
 * ■画面の横幅が981px以上 (PC)
 * ==============================================
 */
@media screen and (min-width : 981px ){
  .sp{  display: none;   }
  .pc{  display: inline; }
  .tab{ display: none;   }
  
  .sp_only{  display: none!important;   }
  .pc_only{  display: inline; }
  .tab_only{ display: none!important;   }
  
  .pc.tab{ display: inline;   }
  
   p.pc{  display: inline-block;  }
   p.pc.tab{  display: inline-block;  }
}



/*
 * ==============================================
 * ■画面の横幅が980pxまで (Tablet & SP)
 * ==============================================
 */
@media screen and (max-width:980px){
  /* iOSでのデフォルトスタイルをリセット */
  input[type="submit"],
  input[type="button"] {
    border-radius: 0;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    appearance: button;
    border: none;
    box-sizing: border-box;
    cursor: pointer;
  }
  input[type="submit"]::-webkit-search-decoration,
  input[type="button"]::-webkit-search-decoration {
    display: none;
  }
  input[type="submit"]::focus,
  input[type="button"]::focus {
    outline-offset: -2px;
  }
  
}



/*
 * ==============================================
 * ■画面の横幅が481pxから980pxまで (Tablet)
 * ==============================================
 */
@media screen and (min-width:481px) and (max-width:980px) {
  .sp{  display: none;   }
  .pc{  display: none; }
  .tab{ display: inline; }
  .pc.tab{ display: inline;   }

  .sp_only{  display: none!important;   }
  .pc_only{  display: none!important; }
  .tab_only{ display: inline;   }
  
  p.tab{  display: inline-block;  }
  p.pc.tab{ display: inline-block;  }
  
  header .sp{  display: inline-block; }
  footer .sp{  display: inline-block; }
  
  header .tab{  display: inline-block; }
  footer .tab{  display: inline-block; }
  
  header .pc.tab{  display: inline-block; }
  footer .pc.tab{  display: inline-block; }
  
}



/*
 * ==============================================
 * ■画面の横幅が480pxまで (SP)
 * ==============================================
 */
@media screen and (max-width:480px){
  .sp{  display: inline;   }
  .pc{  display: none; }
  .tab{ display: none; }
  .sp.tab{ display: inline; }
  .pc.tab{ display: none; }

  .sp_only{  display: inline;   }
  .pc_only{  display: none!important; }
  .tab_only{ display: none!important;   }
  
  p.sp.tab{  display: inline-block;  }
}



/*
 * ==============================================
 * ■画面の横幅が320pxまで (SP)
 * ==============================================
 */
@media screen and (max-width:320px){

}