
/***************************************************************
 *
 * sanitize.css | CC0 Public Domain | github.com/jonathantneal/sanitize.css
 *
***************************************************************/

pre,textarea{overflow:auto}
[hidden],audio:not([controls]),template{display:none}
details,main,summary{display:block}
input[type=number]{width:auto}
input[type=search]{-webkit-appearance:textfield}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}
progress{display:inline-block}
small{font-size:75%}
textarea{resize:vertical}
[unselectable]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
*,::after,::before{box-sizing:inherit;border-style:solid;border-width:0}
*{font-size:inherit;line-height:inherit;margin:0;padding:0}
::after,::before{text-decoration:inherit;vertical-align:inherit}
:root{-ms-overflow-style:-ms-autohiding-scrollbar;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%;box-sizing:border-box;cursor:default;text-rendering:optimizeLegibility}
a{text-decoration:none}
audio,canvas,iframe,img,svg,video{vertical-align:middle}
button,input,select,textarea{background-color:transparent;color:inherit;font-family:inherit;font-style:inherit;font-weight:inherit;}
code,kbd,pre,samp{font-family:monospace,monospace}
nav ol,nav ul{list-style:none}
select{-moz-appearance:none;-webkit-appearance:none}
select::-ms-expand{display:none}
select::-ms-value{color:currentColor}
table{border-collapse:collapse;border-spacing:0}
::-moz-selection{background-color:#B3D4FC;text-shadow:none}
::selection{background-color:#B3D4FC;text-shadow:none}
@media screen{[hidden~=screen]{display:inherit}
[hidden~=screen]:not(:active):not(:focus):not(:target){clip:rect(0 0 0 0)!important;position:absolute!important}
}



/***************************************************************
 *
 * clearfix etc...
 *
***************************************************************/

.cf:before,.cf:after { content: " "; display: table;}
.cf:after { clear: both;}
.cf { *zoom: 1;}


.ib{ 
	letter-spacing: -.40em;
}
.ibc { letter-spacing: normal; }

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

html {
	overflow:hidden;
}
body {
	overflow:hidden;
	margin:0;
}



/***************************************************************
 *
 * Stylesheet for AYAKO KAWAMOTO
 *
***************************************************************/

/*
			Font
*********************************************/

body {
	font-size:16px;
  line-height: 1.4em;
	color:#000000;
	background-color:#FFF;
  font-family: -apple-system, BlinkMacSystemFont, "小塚ゴシック" ,"游ゴシック", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Helvetica Neue", "Noto Sans Japanese", "メイリオ", "Meiryo", sans-serif;
}
a {
	color:#000000;
	text-decoration:none;
}
a:hover {
/*	opacity:0.7; */
}
.font_a {
	font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
}
.font_red {
	color:#FF5B26;
}
.post_body {
  font-size: 0.9em;
}
.post_body p {
	margin-bottom:1em;
}
.post_body blockquote p {
	margin:0;
}
.post_body b {
	font-weight:800;
}
.post_body i {
	font-style:italic;
}
.post_body del {
	text-decoration:overline;
}
.post_body ul ,
.post_body ol {
	margin-bottom:2em;
	padding-left:2em;
}
.post_body img {
	margin-bottom:1em;
}
.underline {
	text-decoration:underline;
}
.small {
	font-size: 0.8em;
}
.post_body h2 {
	border-left: 10px solid #FFAA28;
	border-bottom: 1px solid #FFAA28;
	padding: 0 0 5px 20px; 
	font-size: 1.6em;
  font-weight: 500;
	line-height: 1.4em;
	margin-bottom: 1em;
	margin-top: 2em;
}
.post_body h3 {
	font-size: 1.2em;
  font-weight: 500;
	line-height: 1.4em;
	margin-bottom: 1em;
	margin-top: 2em;
}
.post_body h4 {
	font-size: 1em;
	line-height: 1.4em;
	margin-bottom: 1em;
	margin-top: 2em;
}



/*
			Global Fix
*********************************************/

.absolute_img_wrapper {
	overflow:hidden;
}





/* 
			Responsive
*********************************************/


.res {
	width:1100px;
	margin:0 auto;
	padding:0 10px;
}
.md_show ,
.md_showin ,
.sm_show ,
.sm_showin ,
.xs_show ,
.xs_showin {
	display:none;
}

@media (max-width: 1100px) {
	body {
		font-size:16px;
    font-size: 1.428vw;
    line-height: 1.4em;
	}
  .res {
  	width:100%;
  }
}
@media (max-width: 1024px) {
	body {
		font-size:14.62px;
    font-size: 1.428vw;
    line-height: 1.4em;
	}
}
@media (max-width: 768px) { 
	.md_hide {
		display:none;
	}
	.md_show {
		display:block;
	}
	.md_showin {
		display:inline;
	}
}
@media (max-width: 600px) {
	.sm_hide {
		display:none;
	}
	.sm_show {
		display:block;
	}
	.sm_showin {
		display:inline;
	}
	body {
		font-size:16px;
    font-size: 2.5vw;
    line-height: 1.4em;
	}
	body .font_v {
		font-size:16px;
    font-size: 2.5vw;
    line-height: 1.4em;
	}
}
@media (max-width: 414px) { 
	.xs_hide {
		display:none;
	}
	.xs_show {
		display:block;
	}
	.xs_showin {
		display:inline;
	}
	body {
		font-size:10.35px;
    font-size: 2.5vw;
    line-height: 1.4em;
	}
	body .font_v {
		font-size:10.35px;
    font-size: 2.5vw;
    line-height: 1.4em;
	}
}



/***************************************************************
 *
 * 				LP
 *
***************************************************************/


body {
  background: url("img/06bgimg.png") center top no-repeat #f2f4f1;
}
body > section {
  max-width: 1100px;
  margin: 0 auto;
}

#top {
}
#top > div {
  position:relative;
  padding: 6.8%;
}
#top h1 {
  width:19.54%;
}
#top a:nth-child(2){
  position: absolute;
  width: 2.18%;
  top:30%;
  left: 87%;
}
#top a:nth-child(3){
  position: absolute;
  width: 2.18%;
  top:30%;
  left: 92%;
}

#sec { 
}
#sec > p {
  width: 36.18%;
  margin-left: 2%;
  padding-top: 5%;
  margin-bottom: 10%;
}

#trd {
}
#trd > ul {
  display: flex;
  list-style: none;
  justify-content: space-around;
}
#trd > ul > li {
  width: 21.81%;
}

#fth {
}
#fth > div {
  text-align: center;
  padding: 11% 6.54% 0 1.09%;
}
#fft {
}
#fft h2 {
  text-align: center;
  padding-top: 19%;
  padding-bottom: 5%;
}
#fft h2 > img {
  width: 11%;
}
#fft p {
  padding: 0 0 0 12%;
  line-height: 1.8em;
  margin-bottom: 2em;
}
#fft ul {
  text-align: center;
  list-style: none;
  padding: 7% 0 0 0;
}
#fft ul > li {
  display: inline-block;
  vertical-align: top;
  width: 31.45%;
  margin: 0 4.54%;
}

#btm {
}
#btm > div {
  position: relative;
  padding-top: 60%;
}
#btm > div > p:nth-child(1) {
  position: absolute;
  width: 44%;
  top: 47%;
  left: 3%;
}
#btm > div > a:nth-child(2) {
  position: absolute;
  width: 3.1%;
  top: 40%;
  right: 3%;
}
#btm > div > p:nth-child(3) {
  position: absolute;
  width: 21.54%;
  top: 73%;
  right: 3%;
}

@media (max-width: 1100px) {
  body {
    background:url("img/06bgimg_m.png") center top no-repeat #f2f4f1;
    background-size:contain;
  }
}
@media (max-width: 600px) { 
  body {
    background:url("img/06bgimg_s.png") center top no-repeat #f2f4f1;
    background-size:cover;

  }
  #top {
  }
  #top > div {
    position:relative;
    padding: 6.3% 6.3% 0;
  }
  #top h1 {
    width:36%;
  }
  #top a:nth-child(2){
    position: absolute;
    width: 5%;
    top:65%;
    left: 80%;
  }
  #top a:nth-child(3){
    position: absolute;
    width: 5%;
    top:65%;
    left: 89%;
  }

  #sec { 
  }
  #sec > p {
    width: 66%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0%;
    margin-bottom: 10%;
  }

  #trd {
    padding: 3%;
  }
  #trd > ul {
    display: flex;
    list-style: none;
    flex-wrap: wrap;
    justify-content: space-around;
  }
  #trd > ul > li {
    width: 45%;
    margin-bottom: 0%;
  }

  #fth {
  }
  #fth > div {
    text-align: center;
    padding: 0 6% 0 3%;
  }

  #fft {
  }
  #fft h2 {
    text-align: center;
    padding-top: 5%;
    padding-bottom: 0%;
  }
  #fft h2 > img {
    width: 100%;
  }
  #fft p {
    padding: 0 5% 0 8%;
    font-size: 1.2em;
    line-height: 1.8em;
    margin-bottom: 2em;
  }
  #fft p > br {
    display: none;
  }

  #fft ul {
    text-align: center;
    list-style: none;
    padding: 7% 0 0 0;
  }
  #fft ul > li {
    display: block;
    vertical-align: top;
    width: 57.5%;
    margin: 0 auto 5%;
  }

  #btm {
  }
  #btm > div {
    position: relative;
    padding-top: 76%;
  }
  #btm > div > p:nth-child(1) {
    position: absolute;
    width: 83%;
    top: 9%;
    left: 7%;
  }
  #btm > div > a:nth-child(2) {
    position: absolute;
    width: 5%;
    top: 64%;
    right: 6%;
  }
  #btm > div > p:nth-child(3) {
    position: absolute;
    width: 45%;
    top: 77%;
    right: 27%;
  }
}
