@charset "utf-8";

/* 全体のスタイル */
img {
    max-width: 100%;
    height: auto;
    width: auto;
}

#fv {
    width: 100%;
    margin: 0;
    text-align: center;
	background : #fafcfd;
	padding-bottom : 10px;
	background-image : url(../image/fv-pc-bg.jpg);background-repeat : no-repeat;background-position : center bottom;
}

.fv-pc {
    width: 100%;
}

.fv-tablet {
    display: none; /* タブレット用ヘッダーは最初は非表示 */
}

.fv-sp {
    display: none;
}
.m-40{
	margin-top : -40px;
	margin-bottom : 40px;
}

/*構成・装飾など*/
.main{
	width : 900px;
	margin : 10px auto;
}
.img-gazou{
	text-align : center;
	padding : 15px 0px;
}
.font-m{
	font-size : 115%;
	line-height : 180%;
}
.font-price{
	font-size : 130%;
	line-height : 180%;
}	
.section-space{
	height : 70px;
}
.section-space-s{
	height : 40px;
}
.section-space-ss{
	height : 20px;
}
.area-ttl-yellow {
    font-family: "Zen Kaku Gothic New", sans-serif;
    position: relative;
    color: #330099;
    font-size: 2.2em;
	line-height : 1.4em;
    font-weight: 600;    
    display: inline-block;
    margin: 50px 0;
    text-shadow: 0 0 2px white;
    text-align: center; /* 中央揃えに変更 */
    white-space: nowrap; /* 1行のみ表示するための指定 */
    z-index: 1; /* 円より前面に表示 */
}

.area-ttl-yellow:before {
    content: "";
    position: absolute;
    background-image: url('../image/ttl-bg-yellow.png'); /* 画像のURLを指定 */
    background-size: cover; /* 画像を円の大きさに合わせて表示 */
    width: 260px;
    height: 214px;
    border-radius: 50%;
    top: 50%;
    left: 50%; /* 中央揃えに変更 */
    transform: translate(-50%, -50%);
    z-index: -1;
}

.area-ttl-blue {
    font-family: "Zen Kaku Gothic New", sans-serif;
    position: relative;
    color: #330099;
    font-size: 2.2em;
	line-height : 1.4em;
    font-weight: 600;    
    display: inline-block;
    margin: 50px 0;
    text-shadow: 0 0 2px white;
    text-align: center; /* 中央揃えに変更 */
    white-space: nowrap; /* 1行のみ表示するための指定 */
    z-index: 1; /* 円より前面に表示 */
}

.area-ttl-blue:before {
    content: "";
    position: absolute;
    background-image: url('../image/ttl-bg-blue.png'); /* 画像のURLを指定 */
    background-size: cover; /* 画像を円の大きさに合わせて表示 */
    width: 260px;
    height: 214px;
    border-radius: 50%;
    top: 50%;
    left: 50%; /* 中央揃えに変更 */
    transform: translate(-50%, -50%);
    z-index: -1;
}
.area-ttl-pink {
    font-family: "Zen Kaku Gothic New", sans-serif;
    position: relative;
    color: #330099;
    font-size: 2.2em;
	line-height : 1.4em;
    font-weight: 600;    
    display: inline-block;
    margin: 50px 0;
    text-shadow: 0 0 2px white;
    text-align: center; /* 中央揃えに変更 */
    white-space: nowrap; /* 1行のみ表示するための指定 */
    z-index: 1; /* 円より前面に表示 */
}

.area-ttl-pink:before {
    content: "";
    position: absolute;
    background-image: url('../image/ttl-bg-pink.png'); /* 画像のURLを指定 */
    background-size: cover; /* 画像を円の大きさに合わせて表示 */
    width: 260px;
    height: 214px;
    border-radius: 50%;
    top: 50%;
    left: 50%; /* 中央揃えに変更 */
    transform: translate(-50%, -50%);
    z-index: -1;
}
/* お悩みエリア */
.onayami_area{
	width : 100%;
	padding : 40px 0px;
	background-image : url(../image/onayamni_area_bg.jpg);background-repeat : repeat;
}
/* ７つの能力が開花*/
.nouryoku_area{
	width : 100%;
	padding : 30px 0px;
background-image : url(../image/nouryoku_area_bg.png);background-repeat : repeat-y;background-position : center top;
}

@media screen and (max-width: 1499px) {
#fv {
    width: 100%;
    margin: 0;
    text-align: center;
	background : #fafcfd;
	padding-bottom : 10px;
	background-image : url(../image/fv-tablet-bg.jpg);background-repeat : no-repeat;background-position : center bottom;
}
.nouryoku_area{
	width : 100%;
	padding : 40px 0px;
background : #f9e3ed;
}	
}
.kaika-check ul {
	padding-left: 20px;
	background : #fcfcce;
	padding : 20px;
	font-weight : 600;
}
.kaika-check li {
	list-style: none;
	background: url(../image/orange-checkmark.png)  0% 4px no-repeat;
	padding: 7px 0px 10px 38px;
}
/* 実践したクライアントさん */
.jissen_area{
	width : 100%;
	padding : 40px 0px;
	background : #ffff99;
}
/* 人生が開花*/
.kaika_area{
	width : 100%;
	padding : 40px 0px;
	background-image : url(../image/kaika_area_bg.jpg);background-repeat : repeat;
}
.profile_box {
	width : 900px;
	margin : 50px auto 20px;
    padding: 25px;
    background-color: #ffffe0;/*背景色*/
    box-shadow: 0 0 0 8px #ffffe0;/*背景色外側*/
    border: 2px dashed #deb887;/*線*/
    color: #000000;/*文字色*/
}
.profile-ttl{
	background-color: #fff; /* 背景色 */
	border: 1px solid #8b4513; /* 枠線 */
	border-right: 20px solid #8b4513; /* 右側の太い線 */
	box-shadow: 1px 1px 1px rgba(0,0,0,.1);
	color: #8b4513; /* 文字色 */
	font-weight : 600;
	padding: 10px 20px; /* 上下・左右の余白 */
	position:relative;
	font-size : 20px;
	margin-bottom : 20px;
}
.profile-ttl:after {
	box-shadow: 0 15px 10px rgba(0, 0, 0, .1); /* 付箋の影 */
	content: '';
	position: absolute;
	transform: rotate(1deg);
	-moz-transform: rotate(1deg);
	-webkit-transform: rotate(1deg);
	-o-transform: rotate(1deg);
	bottom: 15px;
	right: -3px;
	width: 85%;
	height: 10px;
	z-index: -1;
}
.name{
	font-size : 1.5em;
	margin-top : 30px;
	color : #8b4513;
	font-weight : 600;
}
.name-2{
	font-size : 1.8em;
	margin-top : 10px;
	color : #8b4513;
	font-family: "Dancing Script", cursive;
}
.kugiri{
	margin-top : 10px;
	border-top: 4px dotted #8b4513;
	width: 320px;
	border-bottom: none;
}
.pro-photo{
	widt : auto;
}
.pro-photo li{
	list-style : none;
	float : left;
	width : 50%;
	padding : 10px;
	text-align : center;
}
/* 開発秘話を公開（ビデオ） */
.koukai_area{
	width : 100%;
	padding : 40px 0px;
	background-image : url(../image/koukai-area-bg.jpg);background-repeat : repeat;
}
/* 「洗剤能力の開花」一択*/
.ittaku_area{
	width : 100%;
	padding : 40px 0px;
}
ul.ittaku{
  counter-reset:list;
  list-style-type:none;
  padding:0;
}
ul.ittaku li{
  position:relative;
  padding: 0 0 0 20px;
  margin: 7px 0 7px 0px;
  font-weight: bold;
  line-height: 30px;
}
ul.ittaku li:before{
  counter-increment: list;
  content: "";
  display: block;
  position: absolute;
  left: 0px;
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background: #333;
  top: 50%;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
/* ７つの能力を目覚めさせる */
.mezame_area{
	width : 100%;
	padding : 40px 0px;
	background : #fef7fa;
}
/* こんなことが学べます*/
.manaberu_area{
	width : 100%;
	padding : 40px 0px;
}
/* こんな方にオススメ */
.osusume_area{
	width : 100%;
	padding : 40px 0px;
	background : #ffff99;
	background-image : url(../image/osusume-area-bg.jpg);background-repeat : repeat;
}
.osusume-check ul {
	padding-left: 20px;
	background : #fff;
	padding : 20px;
	font-weight : 600;
	border-radius : 10px;
}
.osusume-check li {
	list-style: none;
	background: url(../image/red-checkmark.png)  0% 4px no-repeat;
	padding: 7px 0px 10px 38px;
}
/* 気になる参加費*/
.sankahi_area{
	width : 100%;
	padding : 40px 0px;
}
/* 個別セッション */
.session_area{
	width : 100%;
	padding : 20px 0px;
	background-image : url(../image/settion-area-bg.jpg);background-repeat : no-repeat;background-position : center top;
}
.session_box{
	width : 900px;
	margin : 20px auto;
	border : 1px solid #333;
	padding : 20px;
	border-radius : 10px;
	background : #fff;
}
.session_box table{
  border-collapse:separate;
  border-spacing: 5px;
  width: 100%;
}

.session_box table th,table td{
  border-radius: 5px;
  text-align: center;
  padding: 10px 0;
}

.session_box table th{
  background-color: #330099;
  color: white;
  border:solid 1px #4b2309;
	width : 30%;
}

.session_box table td{
  background-color: #fff;
  border:solid 1px #4b2309;
  text-align : left;
	padding-left : 20px;
}
/* 特別プレゼント*/
.present_area{
	width : 100%;
	padding : 40px 0px;
background-image : url(../image/tokuten_area_bg.png);background-repeat : repeat-y;background-position : center top;
}
.present-font{
	font-size : 36px;
	line-height : 52px;
	font-weight : 900;
}
.present-sub-ttl {
	width : 740px;
	margin : 10px auto 30px;
  padding: 1rem 3rem;
	text-align : center;
	font-size : 1.4em;
	font-weight : 600;
  color: #fff;
  border-radius: 100vh;
  background-image: -webkit-gradient(linear, right top, left top, from(#f77c04), to(#f71b04));
  background-image: -webkit-linear-gradient(right, #f77c04 0%, #f71b04 100%);
  background-image: linear-gradient(to left, #f77c04 0%, #f71b04 100%);
}
/* よろこびの声*/
.voice_area{
	width : 100%;
	padding : 40px 0px;
	background-image : url(../image/voice_area_bg.jpg);background-repeat : repeat-y;background-position : center top;
}
.voice-box {
  margin: 20px auto 20px 20px;
  padding: 20px;
  border: 2px solid #434343;
	background : #fff;
  /* 方眼紙模様に必須のスタイル */
  background-image: linear-gradient(0deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px)),
                    linear-gradient(90deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px));
  background-size: 16px 16px;
  background-repeat: repeat;
  background-position: center center;

  /* 以下任意のスタイル */
  padding: 20px;
}
.voice-box-ttl {
  position: relative;
  left: -40px;
  background-color: #ea345f;
  color: #fff;
  padding: 0.5em 1em;
  margin: 0;
  width: 100%;
  font-size: 20px;
  font-weight: bold;
}
.voice-in{
	padding : 20px;
}
.korekara {
  margin: 20px auto;
  padding: 30px 20px 20px 20px;
  border: 2px dashed #ea345f;
  position: relative;
}
.korekara-ttl {
  position: absolute;
  top: -15px;
  left: 20px;
  background-color: #fff;
  padding: 0 0.5em;
  margin: 0;
  font-size: 16px;
	background : #ea345f;
	color : #fff;
	border-radius : 8px;
}
.voice-name{
	font-size : 20px;
	font-weight : 600;
}
.voice-name2{
	font-size : 15px;
	font-weight : 600;
}
.voice-name3{
	font-size : 15px;
	margin-bottom : 30px;
	font-weight : 600;
}
/* よくある質問 */
.faq_area{
	width : 100%;
	padding : 40px 0px;
}
.faq_box{
  position: relative;
  padding: 1.5rem 2rem calc(1rem + 10px);
  background: #cef2fb;
}

.faq_box:before {
  position: absolute;
  top: -7px;
  left: -7px;
  width: 100%;
  height: 100%;
  content: '';
  border: 2px solid #000;
}
.contact-message{
	text-align : center;
	font-size : 18px;
	margin-top : 40px;
	font-weight : 600;
	margin-bottom : 10px;
}
/* 広がる未来*/
.mirai_area{
	width : 100%;
	padding : 40px 0px;
	background-image : url(../image/mirai_area_bg.jpg);background-repeat : no-repeat;background-attachment : fixed;background-position : center top;
}
.main-mirai{
	width : 900px;
	margin : 30px auto 10px;
}
.main-mirai li {
    list-style: none!important;
    float: left;
    width: 50%;
    text-align: center;
	padding : 0 4px;
}
/* さいごに */
.last_area{
	width : 100%;
	padding : 40px 0px;
background-image : url(../image/saigo-area-bg.jpg);background-repeat : repeat;
}
/* 開発者への道のり */
.michinori_area{
	width : 100%;
	padding : 40px 0px;
	background : #fffef8;
}
/* 特商法 */
.tokutei-area{
	width : 900px;
	margin : 20px auto;
	font-size : 15px;
}
.tokutei-ttl{
	background : #330099;
	padding : 20px 0px;
	text-align : center;
	color : #fff;
	font-size : 1.2em;
	margin-bottom : 20px;
}

/* PC用のデザイン */
@media screen and (min-width: 768px) {
    .fv-pc {
        display: block; /* PC用ヘッダーを表示 */
    }

    .fv-tablet {
        display: none; /* タブレット用ヘッダーを非表示 */
    }

    .fv-sp {
        display: none; /* スマホ用ヘッダーを非表示 */
    }
}

/* タブレット用のデザイン */
@media screen and (min-width: 768px) and (max-width: 1023px) {
    .fv-pc {
        display: none; /* PC用ヘッダーを非表示 */
    }

    .fv-tablet {
        display: block; /* タブレット用ヘッダーを表示 */
        width: 100%;
    }

    .fv-sp {
        display: none; /* スマホ用ヘッダーを非表示 */
    }
/*構成*/
.main{
	width : auto;
	margin : 10px 25px;
}
.profile_box {
	width : auto;
	margin : 50px 20px 20px 20px;
    padding: 25px;
}
.session_box{
	width : auto;
	margin : 20px;
}
.main-mirai{
	width : auto;
	margin : 30px 20px;
}
/* 特商法 */
.tokutei-area{
	width : auto;
	margin : 20px;
}
.tokutei-ttl{
	background : #330099;
	padding : 15px 0px;
	text-align : center;
	color : #fff;
	font-size : 1.2em;
	margin-bottom : 20px;
}
}