@charset "utf-8";
/*--------------------------------------------------------------
# Reset
--------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio,video
 { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
body { -webkit-text-size-adjust: none; }

/*--------------------------------------------------------------
# Font
--------------------------------------------------------------*/
html  { font-size: 62.5%; /* 62.5%; sets the base font to 10px for easier math */
}
body { line-height: 1.75em; background-color:#f4f9fb;}
body { font-family: 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; color:#474a4d; /*#2b2b2b;*/
font-size: 16px;  word-wrap: break-word;/*(overflow対策)*/
}


/*--------------------------------------------------------------
# margin / padding
--------------------------------------------------------------*/
body { margin:0 ; padding: 0; }
#header { margin: 0; padding: 0; }
#main { margin: 0; padding: 0; }
.section { margin: 0 0 20px 0; }
.section_top { margin: 20px 0 20px 0;}
div { margin: 0; padding: 0; }
#footer { margin: 0; padding: 0; }
/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/*バーガー枠削除*/
.navbar-toggler { border: none; }
.navbar-toggler:active { outline: none; }
button:focus{ outline: none; }
/*--------------------------------------------------------------
# General Color
--------------------------------------------------------------*/
.text_dark { color: #16160e; } /*text_暗黒色*/
.text_light { color: #fffffc; } /*text_胡粉色*/
.bg_fiore-worm { background: #f5b1aa; } /*background_worm*/
.bg_fiore-cool { background: #51bec1; } /*background_cool*/
.bg_seed { background: #b0c4de; } /*background_seed*/
.worm { background: #f5b1aa; border-radius:10px; } /*background_salmon-pink*/
.cool { background: #eae5e3; border-radius:10px; } /*background_素色*/
.style1 { background: #83cbd7; border-radius:0px; } /*background_tiffany*/
.box3 { background: linear-gradient(to bottom, #f3fbfc, #65bece); }

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/

#head {
  width: 100%;
  height: 80vh;
  background: url("../img/header_fiore.png") center center;
  background-size: cover;
  position: relative;
  margin-top: -80px;
  z-index: 9;
}

#header {
  height: 80px;
  padding: 20px 0;
  z-index: 10;
  position: relative;
}

#header .logo h1 {
  text-align: center ;
  font-size: 32px;
  margin: 0;
  padding: 0;
  line-height: 1;
  font-weight: 300;
  letter-spacing: 3px;
}

/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section.signboard { margin: 0; padding: 10px 0; border-radius:0px; } /*section 角丸なし*/
/*Tiffany blue rgb(10,186,181) / CMYK 95, 0, 3, 27 / #0abab5 */
.section-title { text-align: center;  }
.section-title h2 { font-size: 32px; font-weight: 300; margin-bottom: 20px; padding-bottom: 15px; position: relative; }
.section-title h2::after { content: ''; position: absolute; display: block; width: 80px; height: 1px; background: #fd680e; bottom: 0; left: calc(50% - 40px); }
.section-title p { margin-bottom: 0; font-style: italic; color: #666666; }
.coner-head { font-size: 1.5rem; font-weight: bold;}

/*--------------------------------------------------------------
# Header [ head img ]
--------------------------------------------------------------*/
.signboard { width: 100%; padding: 30px; background-image: url(../img/head-fiore_summer.jpg); /*header 背景 img*/
background-repeat: no-repeat; background-size: cover; background-position: center; height: 400px; position: relative; }
.signboard::before { content: ""; width: 100%; height: 100%; background-color: rgba(21, 112, 110, 0.9); /*header 背景 img+over_color*/
/*background: linear-gradient(90deg, rgba(65, 67, 58, 0.76) 32%, rgba(253, 219, 146, 0) 99%, rgba(201, 211, 211, 0.25));*/
position: absolute; top: 0; left: 0; z-index: 1; }

.signboard { /*display: flex;*/
align-items: center; }

.poster_textarea { color: #fff; position: relative; z-index: 1; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.poster_headline { font-size: 3rem; margin-bottom: 20px; }

/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
/* margin-top margin-bottom margin-left margin-right */
.container-bg { background-color: #fff7f2; }
.container-title { text-align: center; padding-bottom: 30px; }
.container-title h2 { font-size: 32px; font-weight: 300; margin-bottom: 20px; padding-bottom: 15px; position: relative; }
.container-title h2::after { content: ''; position: absolute; display: block; width: 80px; height: 1px; background: #fd680e; bottom: 0; left: calc(50% - 40px); }
.container-title p { margin-bottom: 0; color: #666666; }

/*section ベースカラー https://www.color-hex.com/color/51bec1 Fiore*/
div.section{margin:30px 30px;padding:30px 0 30px 0;border-radius:10px;}
.style1 {background-color:#51bec1;}
.style2 {background-color:#62c4c7;}
.style3 {background-color:#73cbcd;}
.style4 {background-color:#85d1d3;}
.style5 {background-color:#96d8d9;}
.style6 {background-color:#a8dee0;}
.style7 {background-color:#b9e5e6;}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {  background: #51bec1;  padding: 30px 0;  color: #fff;  font-size: 14px; } /*紺藍 #4a488e / fiore #51bec1*/
#footer .copyright { text-align: center; }
#footer .credits { padding-top: 10px; text-align: center; font-size: 13px; color: #fff; }

/*--------------------------------------------------------------
# navi bar & footer
--------------------------------------------------------------*/
.bg-bar { background: #51bec1; } /*紺藍 #4a488e*/