@charset "UTF-8";

/*!
Theme Name: Simplicity2 child
Template:   simplicity2
Version:    20161002
*/

/* Simplicity子テーマ用のスタイルを書く */


/* グローバルナビ */
#navi,

#navi ul{border:0;}

#navi .menu{
  border-radius:0px;
  border-top: 1px solid #3c1808;
}

#navi ul li a{
  color:#dbe0d7;
}

#navi ul li a:hover{
  background-color: #434343;
}

#navi .menu > li > a{
  padding:0.8em 1.5em;
}
#navi .menu > li:first-child{
}


/************************************
** レスポンシブデザインスタイル読込
************************************/

@media screen and (max-width:1110px){
  #navi,
  #navi ul{
    border:0;
  }
 }


/* サイドバー */
#sidebar {
    background-color: #232323;
    border-radius: 4px;
    padding: 7px 10px;
}

#sidebar ul{ 
   margin: 1px; 
   padding: 0; 
   list-style: none; 
}

#sidebar li{ 
   display: inline; 
   padding: 0; 
   margin: 0; 
}

#sidebar li a{
   display: block; 
   border-bottom: 1px solid #404040;
   padding: 10px 10px 10px;
   text-decoration: none;
   letter-spacing: 0.1em;
   color: #dbe0d7;
   margin: 0px;
}

#sidebar li a:hover{
  background-color: #434343;
}


/* 見出し2 */
.article h2{
	position:relative;
	margin:0 10px;
	padding:0 10px 0 55px;
	font:bold 22px/40px Arial, Helvetica, sans-serif;
	color:#ced3cb;
	background:#232323;
	z-index:1;
}

.article h2:before{
	content:" ";
	position:absolute;
	top:0;
	left:0;
	width:40px;
	height:40px;
	border-right:#fff solid 2px;
	background:#232323;
    background-image: -webkit-gradient(linear, left top, left bottom,
			from(			 rgba(255, 255, 255, 0.0)), 
			color-stop(0.20, rgba(255, 255, 255, 0.0)), 
			color-stop(0.20, rgba(255, 255, 255, 0.1)), 
			color-stop(0.40, rgba(255, 255, 255, 0.1)), 
			color-stop(0.40, rgba(255, 255, 255, 0.3)), 
			color-stop(0.60, rgba(255, 255, 255, 0.3)), 
			color-stop(0.60, rgba(255, 255, 255, 0.5)), 
			color-stop(0.80, rgba(255, 255, 255, 0.5)), 
			color-stop(0.80, rgba(255, 255, 255, 0.6)), 
			to(				 rgba(255, 255, 255, 0.6))
			);
	background-image: -webkit-linear-gradient(top,
			transparent 20%,
			rgba(255, 255, 255, 0.1) 20%, 
			rgba(255, 255, 255, 0.1) 40%, 
			rgba(255, 255, 255, 0.3) 40%, 
			rgba(255, 255, 255, 0.3) 60%, 
			rgba(255, 255, 255, 0.5) 60%, 
			rgba(255, 255, 255, 0.5) 80%, 
			rgba(255, 255, 255, 0.6) 80%, 
			rgba(255, 255, 255, 0.6) 100%
			);
	background-image: -moz-linear-gradient(top,
			transparent 20%,
			rgba(255, 255, 255, 0.1) 20%, 
			rgba(255, 255, 255, 0.1) 40%, 
			rgba(255, 255, 255, 0.3) 40%, 
			rgba(255, 255, 255, 0.3) 60%, 
			rgba(255, 255, 255, 0.5) 60%, 
			rgba(255, 255, 255, 0.5) 80%, 
			rgba(255, 255, 255, 0.6) 80%, 
			rgba(255, 255, 255, 0.6) 100%
			);
	background-image: -o-linear-gradient(top,
			transparent 20%,
			rgba(255, 255, 255, 0.1) 20%, 
			rgba(255, 255, 255, 0.1) 40%, 
			rgba(255, 255, 255, 0.3) 40%, 
			rgba(255, 255, 255, 0.3) 60%, 
			rgba(255, 255, 255, 0.5) 60%, 
			rgba(255, 255, 255, 0.5) 80%, 
			rgba(255, 255, 255, 0.6) 80%, 
			rgba(255, 255, 255, 0.6) 100%
			);
	background-image: linear-gradient(to bottom,
			transparent 20%,
			rgba(255, 255, 255, 0.1) 20%, 
			rgba(255, 255, 255, 0.1) 40%, 
			rgba(255, 255, 255, 0.3) 40%, 
			rgba(255, 255, 255, 0.3) 60%, 
			rgba(255, 255, 255, 0.5) 60%, 
			rgba(255, 255, 255, 0.5) 80%, 
			rgba(255, 255, 255, 0.6) 80%, 
			rgba(255, 255, 255, 0.6) 100%
			);
			z-index:-1;
}

.article h2:after{
	content:" ";
	position:absolute;
	top:0;
	left:0;
	width:40px;
	height:40px;
    background-image: -webkit-gradient(linear, left top, right top,
			from(			 rgba(255, 255, 255, 0.0)), 
			color-stop(0.20, rgba(255, 255, 255, 0.0)), 
			color-stop(0.20, rgba(255, 255, 255, 0.1)), 
			color-stop(0.40, rgba(255, 255, 255, 0.1)), 
			color-stop(0.40, rgba(255, 255, 255, 0.3)), 
			color-stop(0.60, rgba(255, 255, 255, 0.3)), 
			color-stop(0.60, rgba(255, 255, 255, 0.5)), 
			color-stop(0.80, rgba(255, 255, 255, 0.5)), 
			color-stop(0.80, rgba(255, 255, 255, 0.6)), 
			to(				 rgba(255, 255, 255, 0.6))
			);
	background-image: -webkit-linear-gradient(left,
			transparent 20%,
			rgba(255, 255, 255, 0.1) 20%, 
			rgba(255, 255, 255, 0.1) 40%, 
			rgba(255, 255, 255, 0.3) 40%, 
			rgba(255, 255, 255, 0.3) 60%, 
			rgba(255, 255, 255, 0.5) 60%, 
			rgba(255, 255, 255, 0.5) 80%, 
			rgba(255, 255, 255, 0.6) 80%, 
			rgba(255, 255, 255, 0.6) 100%
			);
	background-image: -moz-linear-gradient(left,
			transparent 20%,
			rgba(255, 255, 255, 0.1) 20%, 
			rgba(255, 255, 255, 0.1) 40%, 
			rgba(255, 255, 255, 0.3) 40%, 
			rgba(255, 255, 255, 0.3) 60%, 
			rgba(255, 255, 255, 0.5) 60%, 
			rgba(255, 255, 255, 0.5) 80%, 
			rgba(255, 255, 255, 0.6) 80%, 
			rgba(255, 255, 255, 0.6) 100%
			);
	background-image: -o-linear-gradient(left,
			transparent 20%,
			rgba(255, 255, 255, 0.1) 20%, 
			rgba(255, 255, 255, 0.1) 40%, 
			rgba(255, 255, 255, 0.3) 40%, 
			rgba(255, 255, 255, 0.3) 60%, 
			rgba(255, 255, 255, 0.5) 60%, 
			rgba(255, 255, 255, 0.5) 80%, 
			rgba(255, 255, 255, 0.6) 80%, 
			rgba(255, 255, 255, 0.6) 100%
			);
	background-image: linear-gradient(to right,
			transparent 20%,
			rgba(255, 255, 255, 0.1) 20%, 
			rgba(255, 255, 255, 0.1) 40%, 
			rgba(255, 255, 255, 0.3) 40%, 
			rgba(255, 255, 255, 0.3) 60%, 
			rgba(255, 255, 255, 0.5) 60%, 
			rgba(255, 255, 255, 0.5) 80%, 
			rgba(255, 255, 255, 0.6) 80%, 
			rgba(255, 255, 255, 0.6) 100%
			);
			z-index:-1;
}


/* 見出し3 */
.article h3{
    position: relative;
    padding-left: 35px;
    border-bottom: 4px solid #F67C15;
    color: #333;
    font-size: 25px;
    line-height; 29px;
}

.article h3:before {
    position: absolute;
    top: 11px;
    left: 0;
    width: 16px;
    height: 16px;
    border: 3px solid #F67C15;
    content: "";
}

.article h3:after {
    position: absolute;
    top: 3px;
    left: 9px;
    width: 13px;
    height: 13px;
    border: 3px solid #BE272D;
    content: "";
} 


/* 見出し4 */
.article h4{
        position: relative;
	padding: .75em 1em .75em 1.5em;
	border: 1px solid #ccc;
}

.article h4:after {
	position: absolute;
	top: .5em;
	left: .5em;
	content: '';
	width: 6px;
	height: -webkit-calc(100% - 1em);
	height: calc(100% - 1em);
	background-color: #F67C15;
	border-radius: 4px;
}
 

/* 見出し5 */
.article h5{
    position: relative;
    color: #333333;
    background: #FFFFFF;
    font-size: 16pt ;
    border: 3px solid #BE272D;
    margin: 10px 10px 23px 10px;
    padding: 10px 5px 10px 10px;
    border-radius: 3px;
    box-shadow:1px 3px 7px 0px  #666666 ;
}

.article h5:after, .sample2:before {
    content: "";
    position: absolute;
    top: 100%;
    height: 0;
    width: 0;
}

.article h5:after {
    left: 40px;
    border: 10px solid transparent;
    border-top: 10px solid #FFFFFF;
}

.article h5:before {
    left: 37px; 
    border: 13px solid transparent;
    border-top: 13px solid #BE272D;
}


/* 補足説明 */
.point      {position: relative;
            margin:33px 0 30px;
            padding: 22px 20px 12px;
            border-radius: 10px;
            background-color: #ffea85;
            font-size:14px;
            clear: both}

.point:before {position: absolute;
              left: 15px;
              top: -15px;
              content: '\f044';
              z-index: 2;
              width: 33px;
              height: 33px;
              padding-top: 5px;
              padding-left: 3px;
              border-radius: 16px;
              -moz-box-sizing: border-box;
              -webkit-box-sizing: border-box;
              box-sizing: border-box;
              background-color: #F67C15;
              color: #ffffff;
              font-family: 'FontAwesome';
              font-size: 24px;
              line-height: 1;
              text-align: center}

.point:after {position: absolute;
              left: 32px;
              top: -8px;
              z-index: 1;
              content: '補足説明';
              padding: 4px 10px 4px 20px;
              border-radius: 5px;
              background-color: #F67C15;
              color: #ffffff;
              font-family: 'Verdana, Helvetica, sans-serif;
              font-weight: bold;
              line-height: 1}


/* 追記 */
.add       {position: relative;
           margin: 40px 0 30px;
           padding: 20px;
           border-radius: 10px;
           border: dotted 2px #ff0000;
           background-color: #ffefef;
           font-size: 14px;
           clear: both}


.add:before
           {position: absolute;
           left: 23px;
           top: -15px;
           content: '\f14b';
           background-color: #ffffff;
           color: #ff0000;
           font-family: 'FontAwesome';
           font-size: 27px;
           line-height: 1}


/* 引用 */
blockquote {
  background-color: #f8eee5;
    padding: 1.2em 2em 1em;
    position: relative;
    border: 1px solid #d7d7d7;
    margin: 0 1em 1.5em;
    box-shadow: 1px 2px 4px rgba(50,50,50,.5);
    -webkit-box-shadow: 1px 2px 4px rgba(50,50,50,.5);
    -moz-box-shadow: 1px 2px 4px rgba(50,50,50,.5);
}


/* 箇条書き */
.information,
.question{
  background-color: #F4F3EB;
  padding: 15px 20px 15px 50px;
  border-radius: 4px;
  position: relative;
  display: block;
  margin-top: 1em;
  margin-bottom: 1em;
}
 
.information::before,
.question::before{
  font-family: "FontAwesome";
  font-size: 25px;
  position: absolute;
  top: 14px;
  left: 13px;
  color: #EAE3B4;
}
 
.information::before{
  content: '\f28d';
}
 
.question::before{
  content: '\f046';
}

@media screen and (max-width:440px){
  .information,
  .question{
    padding: 10px;
  }
 
  .information::before,
  .question::before{
    display: none;
  }
}


/* リスト改行 */
li {
    word-wrap: break-word;
}


/* 段落改行 */
p {
    word-wrap: break-word;
}


