@charset "UTF-8";
/*
 * Copyright (c) 2006-2019 LeARU Inc
 */
/*
【注意】
このスタイルシートは書き換え禁止です。
変更する場合はmain.cssにオーバーライドしてください。
*/

/*文字装飾
---------------------------------------------------------------------------*/
/*文字揃え*/
.r{text-align:var(--right)} /*右揃え*/
.l{text-align:var(--left)} /*左揃え*/
.c{text-align:var(--center)} /*中央揃え*/

/*ストロングカラー（強調色）*/
.st1{color: var(--st1)} 
.st2{color: var(--st2)} 
.st3{color: var(--st3)}

/*太字*/
.bo{font-weight: 600;} /*デフォルトは600*/
/*下線*/
.ud  {border-bottom: solid 1px;}
/*下線（点線）*/
.ud1  {border-bottom: dotted 2px;}
/*縁（黒）*/
.ol-black {
  display        : inline-block;
  text-shadow    : 
       2px  2px 1px #000,
      -2px  2px 1px #000,
       2px -2px 1px #000,
      -2px -2px 1px #000,
       2px  0px 1px #000,
       0px  2px 1px #000,
      -2px  0px 1px #000,
       0px -2px 1px #000;    
}
/*縁（白）*/
.ol-white {
  display        : inline-block;
  text-shadow    : 
       2px  2px 1px #fff,
      -2px  2px 1px #fff,
       2px -2px 1px #fff,
      -2px -2px 1px #fff,
       2px  0px 1px #fff,
       0px  2px 1px #fff,
      -2px  0px 1px #fff,
       0px -2px 1px #fff;    
}
/*縁（黒ぼかし）*/
.ol-shadow-b{
  display     : inline-block;
  text-shadow:  2px  2px 5px #777 ,
               -2px  2px 5px #777 ,
                2px -2px 5px #777 ,
               -2px -2px 5px #777;
}
/*縁（白ぼかし）*/
.ol-shadow-w{
  display     : inline-block;
  text-shadow:  2px  2px 5px #fff ,
               -2px  2px 5px #fff ,
                2px -2px 5px #fff ,
               -2px -2px 5px #fff;
}


/*フォントサイズ
---------------------------------------------------------------------------*/
.t80 {
font-size: 80%;
	line-height: 1.5;
}
.t85 {
font-size: 85%;
}
.t90 {
font-size: 90%;
line-height: 1.5;
}
.t95 {
font-size: 95%;
}
.t110 {
font-size: 110%;
line-height: 1.5;
}
.t120 {
font-size: 120%;
line-height: 1.5;
}
.t130 {
font-size: 130%;
line-height: 1.5;
}
.t130-3 {
font-size: 130%;
line-height: 1.5;
}

.t140 {
font-size: 140%;
line-height: 1.5;
}
.t150 {
font-size: 150%;
line-height: 1.5;
}
.t150-2 {
font-size: 150%;
line-height: 1.5;
}
.t150-3s {
font-size: 150%;
line-height: 1.5;
}
.t160 {
font-size: 160%;
line-height: 1.5;
}
.t170 {
font-size: 170%;
line-height: 1.5;
}
.t180 {
font-size: 180%;
line-height: 1.5;
}
.t190 {
font-size: 190%;
line-height: 1.5;
}
.t200 {
font-size: 200%;
line-height: 1.5;
}
.t210 {
font-size: 210%;
line-height: 1.5;
}
.t220 {
font-size: 220%;
line-height: 1.5;
}
.t230 {
font-size: 230%;
line-height: 1.5;
}
.t240 {
font-size: 240%;
line-height: 1.5;
}
.t250 {
font-size: 250%;
line-height: 1.5;
}
.t260 {
font-size: 260%;
line-height: 1.5;
}
.t270 {
font-size: 270%;
line-height: 1.5;
}
.t280 {
font-size: 280%;
line-height: 1.5;
}
.t290 {
font-size: 290%;
line-height: 1.5;
}
.t200-2 {
font-size: 200%;
line-height: 1.5;
}
.t300 {
font-size: 300%;
line-height: 1.4;
}
.t320 {
font-size: 320%;
line-height: 1.4;
}
.t340 {
font-size: 340%;
line-height: 1.4;
}
.t360 {
font-size: 360%;
line-height: 1.4;
}
.t380 {
font-size: 380%;
line-height: 1.4;
}
.t400 {
font-size: 400%;
line-height: 1.45;
}
.t420 {
font-size: 420%;
line-height: 1.45;
}
.t440 {
font-size: 440%;
line-height: 1.45;
}
.t460 {
font-size: 460%;
line-height: 1.45;
}
.t480 {
font-size: 480%;
line-height: 1.45;
}
.t500 {
font-size: 500%;
line-height: 1.4;
}
.t550 {
font-size: 550%;
line-height: 1.4;
}
.t600 {
font-size: 600%;
line-height: 1.4;
}

@media only screen and (max-width: 768px) {
.t120,.t130,.t140{
font-size: 110%;
}
.t150-2{
font-size: 100%;
}
.t150-3s{
font-size: 120%;
}	
.t150,.t160,.t170,.t180 ,.t190{
font-size: 125%;
}
.t200,.t210,.t220 ,.t230,.t240,.t250,.t260 ,.t270,.t280 ,.t290{
font-size: 145%;
}
.t300,.t320,.t340 ,.t360,.t380,.t400,.t420 ,.t440,.t460 ,.t480{
font-size: 175%;
}
.t500,.t550,.t600{
font-size: 200%;
}
}
.t200-2{
font-size: 200%;
	line-height: 1.3;
}

/*見出し
---------------------------------------------------------------------------*/

/*文字の左右に線
-------------------------------------*/
/*左揃え*/
.title01-l {         
    position:  relative;    
    display:  inline-block;
    background-color: #fff; 
    margin:0 20px;      
    padding: 0px 10px;        
}
.title01-l-wrap {
    position: relative;     
    margin-bottom:0px;    
}
.title01-l-wrap:before {
    content:  '';           
    background-color: #333;
    display:  block;        
    position:  absolute;   
    left:  0;              
    width:  100%;       
    height:  1px;     
    top: 0;            
    bottom:  0;           
    margin:  auto;
}
/*右揃え*/
.title01-r {         
    position:  relative;    
    display:  inline-block;
    background-color: #fff; 
    margin:0 20px;      
    padding: 0px 10px;        
}
.title01-r-wrap {
    position: relative;     
        
}
.title01-r-wrap:before {
    content:  '';           
    background-color: #333;
    display:  block;        
    position:  absolute;   
    left:  0;              
    width:  100%;       
    height:  1px;     
    top: 0;            
    bottom:  0;           
    margin:  auto;
}
/*中央揃え*/
.title01-c {           
    position:  relative;     
    display:  inline-block;
    background-color: #eeeeee; 
    margin:0px 20px;      
    padding: 0px 10px;          
}
.title01-c-wrap {
    position: relative;      
	margin-bottom:0px;
	text-align: center;
}
.title01-c-wrap:before {
    content:  '';           
    background-color: #333;
    display:  block;        
    position:  absolute;   
    left:  0;              
    width:  100%;       
    height:  1px;     
    top: 0;            
    bottom:  0;           
    margin:  auto;
}
/*文字の上下にライン
-------------------------------------*/

/*タイトル下にライン*/	
.title02-1 {
    border-bottom: 1px #333 solid;
	padding-top: 0px;
    padding-bottom: 10px;
	line-height: 1.4;
	margin-bottom: 15px;
}
.title02-1 span {
  font-size:60%;
  color: #777;
  position: relative;
  top: -5px;
  font-weight: normal;
}
.title02-1 i {
 padding-right: 8px;
 color: var(--red8,333)
}
@media only screen and (max-width: 768px) {
.title02-1 {
    padding-bottom: 6px;
	line-height: 1.2;
	margin-bottom: 10px;
}
.title02-1 span {
  font-size:70%;
}
}

/*タイトル下にライン(点線)*/	
.title02-2 {
    border-bottom: 1px #333 dotted;
	padding-top: 0px;
    padding-bottom: 10px;
	line-height: 1.4;
	margin-bottom: 15px;
}
.title02-2 span {
  font-size:60%;
  color: #777;
  position: relative;
  top: -5px;
  font-weight: normal;
}
.title02-2 i {
 padding-right: 8px;
 color: var(--base,333)
}
@media only screen and (max-width: 768px) {
.title02-2 {
    padding-bottom: 6px;
	line-height: 1.2;
	margin-bottom: 10px;
}
.title02-2 span {
  font-size:70%;
}
}

/*タイトル上下にライン*/	
.title02-3  {
    margin:  0;
    position:  relative;
    padding: 10px 0 10px 0;
    border-top: solid 1px;
    border-bottom:  solid 1px;
    margin: 0 auto 15px;
	line-height: 1.4;
}
.title02-3 span {
  font-size:60%;
  color: #777;
  position: relative;
  top: -5px;
  font-weight: normal;
}
.title02-3 i {
 padding-right: 8px;
 color: var(--base,333)
}
@media only screen and (max-width: 768px) {
.title02-3 {
    padding-bottom: 6px;
	line-height: 1.2;
	margin-bottom: 10px;
}
.title02-3 span {
  font-size:70%;
}
}

/*タイトル上下にライン（点線）*/	
.title02-4  {
    margin:  0;
    position:  relative;
    padding: 10px 0 10px 0;
    border-top: dotted 1px;
    border-bottom:  dotted 1px;
    margin: 0 auto 15px;
	line-height: 1.4;
}
.title02-4 span {
  font-size:60%;
  color: #777;
  position: relative;
  top: -5px;
  font-weight: normal;
}
.title02-4 i {
 padding-right: 8px;
 color: var(--base,333)
}
@media only screen and (max-width: 768px) {
.title02-4 {
    padding-bottom: 6px;
	line-height: 1.2;
	margin-bottom: 10px;
}
.title02-4 span {
  font-size:70%;
}
}

/*タイトル下にライン（ぼかし）*/	
.title02-5 {
    position: relative;
    margin: 0 auto;
    padding: 7px 0px;
    max-width: 100%;
    text-align: center;
    background: #fff;
	margin-bottom: 15px;
	line-height: 1.4;
}
.title02-5:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 4px;
    -webkit-border-radius: 50%;
            border-radius: 50%;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
       -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
    z-index: -1;
}
@media only screen and (max-width: 768px) {
.title02-5 {
	line-height: 1.2;
	margin-bottom: 10px;
}
}


/*チェックマーク付きタイトル*/	
.title03-1-wrap {
padding-left: 1.2em;
margin-bottom: 15px;
}
.title03-1 {
  position: relative;
  padding: 7px 10px 7px 25px;
  margin-left: 0;
  line-height: 1.2;
}
.title03-1:before {
  font-family: "FontAwesome";
  content: "\f00c";
  display: inline-block;
  line-height: 40px;
  position: absolute;
  color: white;
  background: var(--green7);
  font-weight: normal;
  width: 40px;
  text-align: center;
  height: 40px;
  line-height: 35px;
  left: -1em;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  border: solid 3px white; 
  border-radius: 50%;
  font-size:24px;
}
@media only screen and (max-width: 768px) {
.title03-1-wrap {
padding-left: 0.8em;
margin-bottom: 10px;
}
.title03-1 {
  padding: 7px 10px 7px 25px;
  margin-left: 0em;
}
.title03-1:before {
  line-height: 30px;
  position: absolute;
  width: 30px;
  height: 30px;
  line-height: 26px;
  left: -0.9em;
  top: 50%;
  font-size:18px;
}
}

/*チェックマーク付きタイトル*/	
.title03-2-wrap {
padding-left: 1.2em;
margin-bottom: 15px;
}
.title03-2 {
  position: relative;
  padding: 7px 10px 7px 30px;
  margin-left: 1.35.em;
  line-height: 1.2;
}
.title03-2:before {
  font-family: "FontAwesome";
  content: "\f00c";
  display: inline-block;
  line-height: 40px;
  position: absolute;
  color: white;
  background: var(--base);
  font-weight: normal;
  width: 40px;
  text-align: center;
  height: 40px;
  line-height: 40px;
  left: -1em;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  border-radius: 50%;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.29);
  font-size:24px;
}
@media only screen and (max-width: 768px) {
.title03-2-wrap {
padding-left: 0.8em;
margin-bottom: 10px;
}
.title03-2 {
  padding: 7px 10px 7px 25px;
  margin-left: 0em;
}
.title03-2:before {
  line-height: 30px;
  position: absolute;
  width: 30px;
  height: 30px;
  line-height: 30px;
  left: -0.9em;
  top: 50%;
  font-size:18px;
}
}

/*チェックマーク付きタイトル*/	
.title03-3-wrap {
padding-left: 1.2em;
margin-bottom: 15px;
}
.title03-3 {
  position: relative;
  padding: 7px 10px 7px 30px;
  margin-left: 1.35.em;
  line-height: 1.2;
}
.title03-3:before {
  font-family: "FontAwesome";
  content: "\f19d";
  display: inline-block;
  line-height: 40px;
  position: absolute;
  color: white;
  background: var(--base);
  font-weight: normal;
  width: 40px;
  text-align: center;
  height: 40px;
  line-height: 40px;
  left: -1em;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  border-radius: 50%;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.29);
  font-size:24px;
}
@media only screen and (max-width: 768px) {
.title03-3-wrap {
padding-left: 0.8em;
margin-bottom: 10px;
}
.title03-3 {
  padding: 7px 10px 7px 25px;
  margin-left: 0em;
}
.title03-3:before {
  line-height: 30px;
  position: absolute;
  width: 30px;
  height: 30px;
  line-height: 30px;
  left: -0.9em;
  top: 50%;
  font-size:18px;
}
}

.balloon1 {
  position: relative;
  display: inline-block;
  width: 100%;
  padding: 10px 0px;
  background-color: var(--base);
}
.balloon1:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid var(--base);
}


.balloon2 {
  position: relative;
  display: inline-block;
  padding: 10px 0px;
  width: 100%;
  background-color: var(--gray1);
  border: solid 3px var(--gray5);
  box-sizing: border-box;
}

.balloon2:before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid var(--gray1);
  z-index: 2;
}

.balloon2:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid var(--gray5);
  z-index: 1;
}







/*左に縦線（水色）*/	
.title05 {
  padding: 0.25em 0.5em;/*上下 左右の余白*/
  color: #494949;/*文字色*/
  background: transparent;/*背景透明に*/
  border-left: solid 5px #7db4e6;/*左線*/
}
@media only screen and (max-width: 768px) {
.title05 {
    padding-bottom: 5px;
}
}

.title06 {
  position: relative;
  padding: 0.25em 0;
  margin-bottom: 10px;
  line-height: 1.5;
}
.title06:after {
  margin-top: 5px;
  content: "";
  display: block;
  height: 4px;
  background: -moz-linear-gradient(to right, var(--base), transparent);
  background: -webkit-linear-gradient(to right, var(--base), transparent);
  background: linear-gradient(to right, var(--base), transparent);
}
@media only screen and (max-width: 768px) {
.title06 {
  margin-bottom: 10px;
  line-height: 1.4;
}
.title06:after {
  margin-top: 7px;
}
}

.title06-1 {
  position: relative;
  padding: 0.25em 0;
  margin-bottom: 10px;
  line-height: 1.5;
}
.title06-1:after {
  margin-top: 5px;
  content: "";
  display: block;
  height: 4px;
  background: -moz-linear-gradient(to right, var(--red5), transparent);
  background: -webkit-linear-gradient(to right, var(--red5), transparent);
  background: linear-gradient(to right, var(--red5), transparent);
}
@media only screen and (max-width: 768px) {
.title06-1 {
  margin-bottom: 10px;
  line-height: 1.4;
}
.title06-1:after {
  margin-top: 7px;
}
}