@charset "UTF-8";
/* CSS Document */


@media only screen and (max-width : 768px) {

/*-------------------------------------------------------------------------------------
スマホ用レイアウト（768px以下スクリーン）
----------------------------------------------------------------------------------------*/

/*--------------------------------------------------
共通設定(スマホ)
-----------------------------------------------------*/

/*body全体の初期スタイル調整*/
body {
	width: 100%;
  -webkit-text-size-adjust:100%;
	-ms-text-size-adjust:100%;
}

/*--------------------------------------------------
見出しタグ設定（スマホ）
-----------------------------------------------------*/
h2 {
  margin: 0.5em 0em;
  font-size: 1.6em;
  font-weight: bold;
  text-align: center;
}
h3 {
  margin: 0.5em 0em;
  padding: 0.3em 0.6em;
  font-size: 1.4em;
  font-weight: bold;
  border-left: 8px solid #10559A;
  border-bottom: 1px dotted #10559A;
}
h4 {
  margin: 0.5em 0em;
  padding: 0.3em 0.6em;
  font-size: 1.2em;
  border: 1px solid #ccc;
  font-weight: bold;
}
h5 {
  margin: 0.5em 0em;
  padding: 0.1em;
  font-size: 1em;
  font-weight: bold;
  border-bottom: 1px dotted #ccc;
}
/*--------------------------------------------------
全体レイアウト／背景設定（スマホ）
-----------------------------------------------------*/
/*全体エリア（全体背景を設定するにはここ）*/
.main {
  background-color: #f2f2f2;
	overflow:hidden;
}
/*記事(ボディ)エリア*/
.article {
  background-color: #fff;
  border-left: none;
  border-right: none;
  font-size: 1.6em; /*=16px*/
}
/*記事(ボディ)エリアの行間*/
.article p {
  line-height: 1.6;
}
/*カラム全体の幅を変更する*/
.article, .top_image_in {
  width: 100%;
  margin: 0 auto; /*真ん中に要素を置きたいときに使う*/
}
/*--------------------------------------------------
上部固定ヘッダー設定
-----------------------------------------------------*/
/*上部固定ヘッダー全体*/
.header {
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  z-index: 5000;
  background-color: #fff;
  border-bottom: 1px solid #ccc;
  overflow: auto;
}
/*ヘッダー内部をカラム幅にする*/
.header_inr {
  max-width: 100%;
  margin: 0 auto;
  overflow: hidden;
}


/*--------------------------------------------------
ファーストビュー設定
-----------------------------------------------------*/
.top_image {
  background-image: none;
}
.top_image_in img {
  width: 100%;
}
/*--------------------------------------------------
sectionの設定
-----------------------------------------------------*/
.seciton_01 {
  padding: 0.5em 0.5em;
}
.section_02 {
  background-color: #FFFEF0;
  padding: 0.5em 0.5em;
}

/*--------------------------------------------------
CTAエリア
-----------------------------------------------------*/
.area_cta {
  background-color: #fff;
  padding: 1em 0.5em;
}



.scroll_btn {
    animation-name:fuwafuwa; /* fuwafuwaっていうアニメーションの名前*/
    animation-duration:2s; /*アニメーションの時間設定*/
    animation-iteration-count:infinite; /*アニメーションの繰り返し設定*/
}

@keyframes fuwafuwa {
    0% {-webkit-transform:translate(0, 0px);}/*X軸とY軸*/
    50% {-webkit-transform:translate(0, -10px);}
    100% {-webkit-transform:translate(0, 0px);}
}

.cta_causion{
	color: #886c58;
	font-weight: bold;
	padding: 1em;

}



/*--------------------------------------------------
フェードイン、フェードアウト
-----------------------------------------------------*/
/*フェードイン*/
.fadein {
    opacity : 0;
    transform: translateY(0px);
    transition: all 2s;
}

/*左からフェードイン*/
.fadeinleft {
    opacity : 0;
    transform: translateX(-100px);
    transition: all 2s;
}

/*右からフェードイン*/
.fadeinright{
    opacity : 0;
    transform: translateX(100px);
    transition: all 2s;
}




/*--------------------------------------------------
フッター部分
-----------------------------------------------------*/
.footer {
  background-color: #00164b;
  padding: 2em 0em;
  text-align: center;
  font-size: 1.2em;
  color: #fff;
}
.footer a {
  color: #fff;
}



}