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%;}



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

@media(max-width:767px) { .lead_ac { 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; }





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



.left_p{ padding:10px; float:left;}

.left_p img{ height:250px; }



 .wides{ width:1100px; margin: 0 auto;}



.disp_sp{ display:none;}

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



.disp_pc{ display:block;}

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



/**

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

**/







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%;}





/**トップナビ　オリジナルバー**/

.navbar-extra { background-color: rgba(0,0,0,0.8);}

.navbar-extra .navbar-brand { color: #fff; }

.navbar-extra .navbar-brand:hover,

.navbar-extra .navbar-brand:focus { color: #fff; background-color: transparent; }

.navbar-extra .navbar-text { color: #9d9d9d;}

.navbar-extra .navbar-nav > li > a { color: #fff;}

.navbar-extra .navbar-nav > li > a:hover,

.navbar-extra .navbar-nav > li > a:focus { color: #C30; background-color: transparent;}

.navbar-extra .navbar-nav > .active > a,

.navbar-extra .navbar-nav > .active > a:hover,

.navbar-extra .navbar-nav > .active > a:focus { color: #fff; background-color: #080808;}

.navbar-extra .navbar-nav > .disabled > a,

.navbar-extra .navbar-nav > .disabled > a:hover,

.navbar-extra .navbar-nav > .disabled > a:focus { color: #444; background-color: transparent;}

.navbar-extra .navbar-toggle {

  border-color: #333;

}

.navbar-extra .navbar-toggle:hover,

.navbar-extra .navbar-toggle:focus {

  background-color: #333;

}

.navbar-extra .navbar-toggle .icon-bar {

  background-color: #fff;

}

.navbar-extra .navbar-collapse,

.navbar-extra .navbar-form {

  border-color: #101010;

}

.navbar-extra .navbar-nav > .open > a,

.navbar-extra .navbar-nav > .open > a:hover,

.navbar-extra .navbar-nav > .open > a:focus {

  color: #fff;

  background-color: #080808;

}

@media (max-width: 767px) {

  .navbar-extra .navbar-nav .open .dropdown-menu > .dropdown-header {

    border-color: #080808;

  }

  .navbar-extra .navbar-nav .open .dropdown-menu .divider {

    background-color: #080808;

  }

  .navbar-extra .navbar-nav .open .dropdown-menu > li > a {

    color: #fff;

  }

  .navbar-extra .navbar-nav .open .dropdown-menu > li > a:hover,

  .navbar-extra .navbar-nav .open .dropdown-menu > li > a:focus {

    color: #fff;

    background-color: transparent;

  }

  .navbar-extra .navbar-nav .open .dropdown-menu > .active > a,

  .navbar-extra .navbar-nav .open .dropdown-menu > .active > a:hover,

  .navbar-extra .navbar-nav .open .dropdown-menu > .active > a:focus {

    color: #C30;

    background-color: #080808;

  }

  .navbar-extra .navbar-nav .open .dropdown-menu > .disabled > a,

  .navbar-extra .navbar-nav .open .dropdown-menu > .disabled > a:hover,

  .navbar-extra .navbar-nav .open .dropdown-menu > .disabled > a:focus {

    color: #fff;

    background-color: transparent;

  }

}

.navbar-extra .navbar-link {

  color: #9d9d9d;

}

.navbar-extra .navbar-link:hover {

  color: #fff;

}

.navbar-extra .btn-link {

  color: #9d9d9d;

}

.navbar-extra .btn-link:hover,

.navbar-extra .btn-link:focus {

  color: #C30;

}

.navbar-extra .btn-link[disabled]:hover,

fieldset[disabled] .navbar-extra .btn-link:hover,

.navbar-extra .btn-link[disabled]:focus,

fieldset[disabled] .navbar-extra .btn-link:focus {

  color: #444;

}







/****************************************************



bootstrap カスタマイズ



****************************************************/

/*パンくず設定*/

.breadcrumb{ font-size: 80%; border-radius: 0px; background-color: transparent;}



/**パソコン**/

@media (min-width: 768px){ .pc_disp{ display:none; } .space_top{ margin:30px;}}

/**モバイル**/

@media (max-width: 767px) { .sp_disp{ display:none;} .space_top{ margin:10px;}}



/* .row の左右のネガティブマージンを0にする */

.row-0 { margin-left: 0; margin-right: 0; }

.row-0 > [class*="col-"] { padding-left: 0; padding-right: 0; }

.row-10 { margin-left: -5px; margin-right: -5px; }

.row-10 > [class*="col-"] { padding-left: 5px; padding-right: 5px; }

.row-20 { margin-left: -10px; margin-right: -10px; }

.row-20 > [class*="col-"] { padding-left: 10px; padding-right: 10px; }

.row-30 { margin-left: -15px; margin-right: -15px; }

.row-30 > [class*="col-"] { padding-left: 15px; padding-right: 15px; }

.row-40 { margin-left: -20px; margin-right: -20px; }

.row-40 > [class*="col-"] { padding-left: 20px; padding-right: 20px; }



/**画像縮小**/

.img_small img{ width:90%; text-align:center;}

.img_size_100 { width: 100%; }

.img_size_90 { width: 90%; }

.img_size_80 { width: 80%; }



/**スペース調整**/

.none_space{ margin:0; padding:0;}



/**高さ合わせ調整col**/

.row-eq-height { display: flex; flex-wrap: wrap; }

/**safari対策**/

.row-eq-height:before,

.row-eq-height:after,

.row:before { content: normal; }



/**　タイトルデザイン　**/

.thumnail_main_title{ margin:30px 0;}

.thumnail_main_title  h2 { color:#00ACD3; position: relative; margin-top: 20px; text-align:center; font-weight:900 ; font-size:180%;}

.thumnail_main_title  h2.title { margin-top: 0; }

.thumnail_main_title  h2.title:before { content: ""; display: block; border-top: solid 2px #00ACD3; width: 100%; height: 2px; position: absolute; top: 50%; z-index: 1; }

.thumnail_main_title  h2.title span { padding: 0 20px; position: relative; z-index: 5;}



.thumnail_main_title_white{ margin:30px 0;}

.thumnail_main_title_white  h2 { color:#fff; position: relative; margin-top: 20px; text-align:center; font-weight:900 ; font-size:180%;}

.thumnail_main_title_white  h2.title { margin-top: 0; }

.thumnail_main_title_white  h2.title:before { content: ""; display: block; border-top: solid 1px #fff; width: 100%; height: 2px; position: absolute; top: 50%; z-index: 1; }

.thumnail_main_title_white  h2.title span { padding: 0 20px; position: relative; z-index: 5;}





/** ボタンカスタマイズ **/

.back_top_in{ background:url(/images/default/head/back.gif); color:#fff; padding:20px 50px; }

.back_top_in:hover{ background:url(/images/default/head/back-2.gif); color:#fafafa; }





/** フッターデザイン **/

footer ul{ margin:0; padding:0; list-style:none; }

footer ul li{ margin: 0 0 0 10px; padding:5px; }

footer ul li a{ color:#333;}

footer ul li a:hover{ color:#78aadb; }







/**　ヘッダー関連 **/

.head_box{ background:#F5EFE6;  }

.head_box h1{ background:#EB6142; padding:5px 20px; float:right; margin:0; color:#fff; font-size:100%;}

.head_box:after { content: "";clear: both; height: 0; display: block; visibility: hidden;}



header{ background:#fff;}

hgroup{ clear:both;}