@charset "utf-8";

/* -------------------------------- 

Primary style

-------------------------------- */
html * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-print-color-adjust: exact;
}

*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  background-color: white;
  width: 100%;
  position: absolute;
  top:0;
}

body,div,ul,li,a,h1,h2,h3,h4,p,span,dd,dt,tr,th,td,a,input,textarea{
  font-size: 100%;
  font-family: 'Nunito','YuGothic', '游ゴシック',"Hiragino Kaku Gothic ProN","メイリオ",sans-serif;
  color: #373737;
  text-decoration: none;
  list-style:none;
  text-align: justify;
  text-justify: inter-ideograph;
  font-feature-settings : "palt";
  letter-spacing: 0.1em;
  font-weight:normal;
  line-height:1.7;
}

body, html {
  /* important */
  height: 100%;
  line-height:1.5;
}

a {
  text-decoration: none;
  line-height:1.5;
}

/* -------------------------------- 

Modules - reusable parts of our design

-------------------------------- */
.cd-container {
  /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
}
.cd-container::after {
  /* clearfix */
  content: '';
  display: table;
  clear: both;
}


/* -------------------------------- 

Main components 

-------------------------------- */

.cd-header .common-header {
  overflow: hidden;
  width: 100%;
}

.cd-header:after {
  content: "";
  display: table;
  clear: both;
}

/*ボタンエフェクト*/
.ripple {
  position: relative;
  overflow: hidden;
}

.ripple .rp-effect {/*エフェクト*/
  position: absolute;
  border-radius: 50%;
  opacity: 0.35;/*波紋の濃さ*/
  transform: scale(0);
  background: rgba(180,230,30,0.6);
  animation: ripple 700ms;
  pointer-events: none; 
}

@-webkit-keyframes ripple {
  to {
    opacity: 0;
    transform: scale(2.0);
  }
}

@keyframes ripple {
  to {
    opacity: 0;
    transform: scale(2.0);
  }
}

.raised{
  display: inline-block;
  color: #373737;
  font-size: 1em;
  text-decoration: none;
  letter-spacing: 0.05em;
  padding: 0.6em 1.3em;
  border-radius: 2px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: .3s;
}

.txt_center{
  text-align: center;
}

.gray{
  color: #626262;
}

/*パソコン版*/ 
@media screen and (min-width : 801px){

.sp{
     display : none !important;
}
}

/*スマホ版*/
@media screen and (max-width : 800px){

.pc{
     display : none!important;
}		
}