/*
	Theme Name: diver_child
	Template: diver
	Description:  Diverの子テーマです。
	Theme URI: http://tan-taka.com/diver/
	Author: Takato Takagi
 */

/* カスタマイズする場合にはこれより下に追記してください  */

/* ！！スマホの設定！！ */
@media screen and (max-width:599px){

   /* ココにスマホ画面の時のCSSを記入 */
/* 改行タグを省略 */
.single-post-main br { 
   display:none;
} /*スマホの設定ーここまで*/

/*囲み枠　シンプルBOX*/
.simplebox {
	padding: 0.5em 1em;
    margin: 2em 0;
    font-weight: normal;
    color: #6091d3;/*文字色*/
    background: #FFF;
    border: solid 2px silver;/*線*/
    border-radius: 10px;/*角の丸み*/
}
.simplebox p {
    margin: 0;
    padding: 0;
}

/*囲み枠　シンプルBOX・グレー*/
.simplebox-gray {
    padding: 0.5em 1em;
    margin: 2em 0;
    font-weight: normal;
    border: solid 2px silver;
}
.simplebox-gray p {
    margin: 0;
    padding: 0;
}

/*囲み枠　交差BOX*/
.kousa-box{
    margin:2em 0;
    position: relative;
    padding: 0.5em 1.5em;
    border-top: solid 2px silver;
    border-bottom: solid 2px silver;
}
.kousa-box:before, .kousa-box:after{
    content: '';
    position: absolute;
    top: -10px;
    width: 2px;
    height: -webkit-calc(100% + 20px);
    height: calc(100% + 20px);
    background-color: silver;
}
.kousa-box:before {left: 10px;}
.kousa-box:after {right: 10px;}
.kousa-box p {
    margin: 0;
    padding: 0;
}

/*囲み枠　背景水色BOX*/
.bgcl-box {
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #2c2c2f;
    background: #dcdcdc;/*背景色*/
}
.bgcl-box p {
    margin: 0;
    padding: 0;
}

/*囲み枠　ラベルBOX*/
.label-box {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
}
.label-box .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 17px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.label-box p {
    margin: 0;
    padding: 0;
}

/*囲み枠　考えるBOX*/
.think-box {
    position: relative;
    margin: 2em 0 2em 40px;
    padding: 8px 15px;
    background: #fff0c6;
    border-radius: 30px;
}
.think-box:before{font-family: FontAwesome;
    content: "\f111";
    position: absolute;
    font-size: 15px;
    left: -40px;
    bottom: 0;
    color: #fff0c6;
}
.think-box:after{
    font-family: FontAwesome;
    content: "\f111";
    position: absolute;
    font-size: 23px;
    left: -23px;
    bottom: 0;
    color: #fff0c6;
}
.think-box p {
    margin: 0;
    padding: 0;
}

/*囲み枠　ラベルinBOX*/
.labelin-box {
    position: relative;
    margin: 2em 0;
    padding: 25px 10px 7px;
    border: solid 2px #FFC107;
}
.labelin-box .box-title {
    position: absolute;
    display: inline-block;
    top: -2px;
    left: -2px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 17px;
    background: #FFC107;
    color: #ffffff;
    font-weight: bold;
}
.labelin-box p {
    margin: 0;
    padding: 0;
}

/*囲み枠　ラベルラインBOX*/
.labelline-box {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #95ccff;
    border-radius: 8px;
}
.labelline-box .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #95ccff;
    font-weight: bold;
}
.labelline-box p {
    margin: 0;
    padding: 0;
}

/*囲み枠　スマートBOX*/
.smart-box{
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #5d627b;
    background: white;
    border-top: solid 5px #5d627b;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
}
.smart-box p {
    margin: 0;
    padding: 0;
}


/*左下ボーダー*/
.lu-border {
  padding: .25em 0 .5em .75em;
  border-left: 6px solid #ccc;
  border-bottom: 1px solid #ccc;
}


/*下ボーダー２色*/
.u-border-2cl {
  position: relative;
  padding-bottom: .5em;
  border-bottom: 4px solid #ccc;
}
.u-border-2cl::after {
  position: absolute;
  bottom: -4px;
  left: 0;
  z-index: 2;
  content: '';
  width: 20%;
  height: 4px;
  background-color: #3498db;
}

/*フキダシ影*/
span.speech {
  position: relative;
  padding: .5em .75em;
  background-color: #f0f0f0;
  border-radius: 6px;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, .1) inset;
}
span.speech::after {
  position: absolute;
  top: 100%;
  left: 30px;
  content: '';
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-top: 15px solid #f0f0f0;
}

/*グレー下線*/
span.g-underline {
  padding-bottom: .5em;
  border-bottom: 1px solid #ccc;
}

/*マーカー（水色・細）*/
span.m-underline {
  position: relative;
  padding: 0 .4em .1em;
}
span.m-underline::after {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
  content: '';
  width: 100%;
  height: 10px;
  background-color: #b6f0fc;
}

/*マーカー(黄色・太)*/
span.marker_yellow_futo {
background: linear-gradient(transparent 0%, #ffff66 0%);
}

/*マーカー(黄色・細)*/
.marker_yellow_hoso {
background: linear-gradient(transparent 60%, #ffff66 60%);
}

/*左グレーボーダー*/
.left-gray-border {
  padding: .25em 0 .25em .75em;
  border-left: 6px solid #ccc;
}