body,html {width: 100%; height: 100%;  }



h1,h2,h3,h4,h5,h6 { font-family: 'Noto Sans Japanese', sans-serif; font-weight: 700; }



.topnav { font-size: 14px; }



.lead { font-family: 'Noto Sans Japanese', sans-serif; font-weight:200; font-size: 100%;}



.noto_100 { font-family: 'Noto Sans Japanese', sans-serif; font-weight:100; }

.noto_200 { font-family: 'Noto Sans Japanese', sans-serif; font-weight:200; }

.noto_300 { font-family: 'Noto Sans Japanese', sans-serif; font-weight:300; }

.noto_400 { font-family: 'Noto Sans Japanese', sans-serif; font-weight:400; }

.noto_500 { font-family: 'Noto Sans Japanese', sans-serif; font-weight:500; }

.noto_600 { font-family: 'Noto Sans Japanese', sans-serif; font-weight:600; }

.noto_700 { font-family: 'Noto Sans Japanese', sans-serif; font-weight:700; }





.lato_100 { font-family: 'Lato'; font-weight:100; }

.lato_400 { font-family: 'Lato'; font-weight:400; }

.lato_700 { font-family: 'Lato'; font-weight:700; }

.lato_900 { font-family: 'Lato'; font-weight:900; }



.font_size80{ font-size:80%;}

.font_size100{ font-size:100%;}

.font_size120{ font-size:120%;}

.font_size130{ font-size:130%;}

.font_size140{ font-size:140%;}

.font_size150{ font-size:150%;}

.font_size160{ font-size:160%;}

.font_size170{ font-size:170%;}

.font_size180{ font-size:180%;}

.font_size190{ font-size:190%;}

.font_size200{ font-size:200%;}



.intro-header { padding: 30px 0; text-align: center; color: #f8f8f8; background: url(../img/intro-bg.jpg) no-repeat center center; background-size: cover;}





/*gridのgutter調整*/

.row_0{ margin-left:0px; margin-right:0px;

	> div{ padding-right:0px; padding-left:0px; }

}

.row_10{ margin-left:-5px; margin-right:-5px;

	> div{ padding-right:5px; padding-left:5px;}

}

.row_20{ margin-left:-10px; margin-right:-10px;

	> div{ padding-right:10px; padding-left:10px;}

}

.row_30{ margin-left:-15px; margin-right:-15px;

	> div{ padding-right:15px; padding-left:15px;}

}

.row_40{ margin-left:-20px; margin-right:-20px;

	> div{ padding-right:20px; padding-left:20px; }

}





/**

background: url(../img/intro-bg.jpg) no-repeat center center;

**/

.disp_sp{ display:none;}

@media(max-width:767px) { .disp_sp{ display:block;} }



.disp_pc{ display:block;}

@media(max-width:767px) { .disp_pc{ display:none;} }





h1.main_title{ font-size:200%; font-family:'lato'; text-align:center; font-weight: 100; letter-spacing:0.5em; margin:0;  }

h1.sub_title{ text-shadow: 2px 2px 3px rgba(0,0,0,0.6); color:#fff; text-align:center;}

h2.sub_title{ font-family:'Noto Sans Japanese'; text-shadow: 2px 2px 3px rgba(0,0,0,0.6); font-weight:200;}

.text_shadows{ text-shadow: 2px 2px 3px rgba(0,0,0,0.6);}

.text_border{ border-left:1px solid #CCC; padding:5px 10px; line-height:100%;}

.text_border p{ margin:1% 0;}



.box_border{ width:600px; margin: 0 auto; padding:10px; border:1px solid #fff; border-radius:5px;}

@media(max-width:767px) {

	.box_border{ width:100%;}

}

/**CSSアニメーションボタン**/

a.btn-default { color: #008ed6; background:#fff; border-radius:5px; border:2px solid #eee; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease;}

a.btn-default:hover { color: #FFF; background:#008ed6; border:2px solid #008ed6;}

@media(max-width:767px) {a.btn_ani{} a.btn_ani:hover {}}





.intro-message { position: relative; padding: 5% 0 0 0; }

.intro-message > h1 { margin: 20px 0 0 0; text-shadow: 2px 2px 3px rgba(0,0,0,0.6); font-size: 350%; }

.intro-divider { width: 400px; border-top: 1px solid #f8f8f8; border-bottom: 1px solid rgba(0,0,0,0.2); }

.intro-message > h3 { text-shadow: 2px 2px 3px rgba(0,0,0,0.6); }





/**タブレット・スマホ用**/

@media(max-width:767px) {

.intro-header { padding: 50px 0;}

.intor-btn{ width:100%; padding:30px;}	

.intro-message { padding-bottom: 15%; }

.intro-message > h1 { font-size: 300%;}

ul.intro-social-buttons > li {display: block; margin-bottom: 20px; padding: 0; }

ul.intro-social-buttons > li:last-child { margin-bottom: 0; }

.intro-divider { width: 100%; }

}



.network-name { text-transform: uppercase; font-size: 14px; font-weight: 400; letter-spacing: 2px;}

.content-section-a { padding: 50px 0; background-color: #f9f9f9;}

.content-section-b { padding: 50px 0; background:#fff; border-top: 1px solid #e7e7e7; border-bottom: 1px solid #e7e7e7; }



h2.section-heading { font-weight:100; font-size:200%; margin:3% 0; }

h3.section-heading { font-weight:200; font-size:150%; margin:3% 0; }



.section-heading-spacer { float: left; width: 200px; border-top: 3px solid #e7e7e7; }



.banner { padding: 100px 0; color: #f8f8f8; background: url(../img/banner-bg.jpg) no-repeat center center; background-size: cover; }

.banner h2 { margin: 0; text-shadow: 2px 2px 3px rgba(0,0,0,0.6); font-size: 3em;}

.banner ul { margin-bottom: 0;}

.banner-social-buttons { float: right; margin-top: 0;}



/***円系セット***/

.border_box01_w{ width:80%; margin:0 auto;}

.border_box01_m{ width:250px; margin:0 auto;}

.border_box01{ border-radius:50%; height:250px; width:250px; display: table-cell; vertical-align:middle; text-align:center; border:1px solid #ccc; }

.border_box01{ font-size:130%; background:#fff; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease;}

.border_box01:hover{ background: #a6e0f5;}

@media(max-width:1199px) { .border_box01_w{ width:80%; } .border_box01{ height:200px; width:200px;  }}

@media(max-width:991px) { .border_box01_w{ width:90%; margin:0 auto;} }

@media(max-width:767px) { .border_box01_m{ width:200px; margin:10px auto;} .border_box01_w{ width:100%;}  }



.text_r{ text-align:right;}

@media(max-width:767px) {.text_r{ text-align:center;}}



.form_wide{ width:70%; margin:0 auto;}

@media(max-width:1199px) {.form_wide{ width:90%; margin:0 auto;}}



/**タイトル表示あるなし　お試し読み本**/

.title_none_sp{ display:none;} .title_none_pc{ }

@media(max-width:767px) {.title_none_pc{ display:none;}.title_none_sp{ display:block;}}



/**PC用**/

@media(max-width:1199px) {

ul.banner-social-buttons {float: left; margin-top: 15px; }

}



/**タブレット用**/

@media(max-width:767px) {

.banner h2 { margin: 0; text-shadow: 2px 2px 3px rgba(0,0,0,0.6); font-size: 3em; }

ul.banner-social-buttons > li { display: block; margin-bottom: 20px; padding: 0; }

ul.banner-social-buttons > li:last-child { margin-bottom: 0; }

}



footer { padding: 50px 0; background-color: #f8f8f8; }

p.copyright { margin: 15px 0 0; }





/**画像マスク　円**/

.img_circle{ border-radius:50%; width:400px; }

@media(max-width:767px) {.img_circle{ border-radius:50%; width:300px; } }





/**フォーム**/

.text_other{ padding:5px; border:1px solid #eee; background:#fff; border-radius:3px; margin:5px 0;}



/**個人情報枠**/

.privacy{ width:90%; margin:10px auto; height:200px; border:1px solid #eee; border-radius:5px; background:#fefefe; overflow: auto; font-size:90%; padding:10px;}

.privacy h3,h4{ font-size:100%;}