/* -----------------------------------------------
 * 見出しＣＳＳ
 * ----------------------------------------------- */

/* 左・下ボーダ
 * --------------------------- */
.title_border {
	position: relative;
/*	margin:1em 0.5em 0.5em 0.5em;*/
	padding: .25em 0 .5em .60em;
	border-left: 6px solid #E79723;
	font-size:1.3em;
	font-weight:bold;
}
.title_border::after {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	width: 100%;
	height: 0;
	border-bottom: 1px solid #E79723;
}

/* 吹き出し
 * --------------------------- */
.title_fukidashi{
	position:relative;
	margin:15px 5px 20px 5px;
	padding:10px 10px 10px 15px;
	/*color:#4e4d4d;*/
	color:#000;
	border:#4e4d4d solid 2px;
	border-radius:18px;
	background:#fff;
	box-shadow:
        -7px -5px 0 0 #eee inset,
        2px 3px 0 0 #4e4d4d;
}
.title_fukidashi:before{
	content:" ";
	position:absolute;
	top:100%;
	left:14px;
	width:0;
	height:0;
	border-width:20px;
	border-style:solid;
	border-color:transparent;
	border-top-color:#4e4d4d;
}
.title_fukidashi:after{
	content:" ";
	position:absolute;
	bottom:-27px;
	left:18px;
	width:0;
	height:0;
	border-width:14px;
	border-style:solid;
	border-color:transparent;
	border-top-color:#eee;
}

/* 吹き出し2
 * --------------------------- */
.title_fukidashi2{
	position: relative;
	padding: .6em .75em;
	/*background-color: #f0f0f0; 薄いグレー */
	/* background-color: #4e4d4d;濃いグレー */
	background-color: #2e4da8;/*明るめの紺色 */
	color:#fff;
	font-size:1.2em;
	font-weight:bold;
}
.title_fukidashi2:after {
	position: absolute;
	top: 100%;
	left: 30px;
	content: '';
	width: 0;
	height: 0;
	border: 10px solid transparent;
	/*border-top: 15px solid #f0f0f0; 薄いグレー */
	/*border-top: 15px solid #4e4d4d; 濃いグレー */
	border-top: 15px solid #2e4da8;/*明るめの紺色 */
}

/* 吹き出し3（濃いピンク）
 * --------------------------- */
.title_fukidashi3{
	position: relative;
	padding: .6em .75em;
/*	background-color: #ff5110;　濃いオレンジ*/
	background-color: #ff705c;
/*	border-radius: 6px;*/
	font-size:1.1em;
	font-weight:bold;
	color:#fff;
}

.title_fukidashi3:after{
	content:" ";
	position:absolute;
	bottom:-27px;
	left:18px;
	width:0;
	height:0;
	border-width:14px;
	border-style:solid;
	border-color:transparent;
	border-top-color:#ff705c;
}

/* 吹き出し4（水色）
 * --------------------------- */
.title_fukidashi4{
	position: relative;
	padding: .6em .75em;
/*	background-color: #ff6600;濃いオレンジ */
	background-color: #59b1eb;
/*	border-radius: 6px;*/
	font-size:1.1em;
	font-weight:bold;
	color:#fff;
}

.title_fukidashi4:after{
	content:" ";
	position:absolute;
	bottom:-27px;
	left:18px;
	width:0;
	height:0;
	border-width:14px;
	border-style:solid;
/*	border-color:transparent;
/*	background-color: #ff6600;濃いオレンジ */
	border-top-color:#59b1eb;
}

/* 吹き出し5（黄緑）
 * --------------------------- */
.title_fukidashi5{
	position: relative;
	padding: .6em .75em;
	background-color: #a7be18;
/*	border-radius: 6px;*/
	font-size:1.1em;
	font-weight:bold;
	color:#fff;
}
.title_fukidashi5:after{
    content:" ";
    position:absolute;
    bottom:-27px;
    left:18px;
    width:0;
    height:0;
    border-width:14px;
    border-style:solid;
    border-color:transparent;
    border-top-color:#a7be18;
}

/* 吹き出し6（背景薄いグレー）
 * --------------------------- */
.title_fukidashi6{
	position: relative;
	padding: .6em .75em;
	background-color: #f0f0f0;
	border-radius: 6px;
  font-size:1.1em;
  /*font-weight:bold;*/
}
.title_fukidashi6:after {
	position: absolute;
	top: 100%;
	left: 30px;
	content: '';
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-top: 15px solid #f0f0f0;
}

/* 吹き出し7
 * --------------------------- */
.title_fukidashi7{
	margin:10px 0px 20px 0px;
	position: relative;
	padding: .6em .75em;
	/*padding: .6em .75em;*/
	background-color: #66cccc;
	border-radius: 0px;
	font-size:1.5em;
	font-weight:bold;
	color:#fff;
}
.title_fukidashi7:after {
	position: absolute;
	top: 100%;
	left: 30px;
	content: '';
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-top: 15px solid #66cccc;
}


/* テープ 黄色
 * --------------------------- */
.tape{
    /*width:1200px; 追加
    font-size:2.0em; */
    font-size:1.5em;
    position:relative;
    margin:20px 0 5px 0;
    /*margin:0 -1px;*/
    padding:10px;
    /*padding:35px;*/
    /*font:bold 30px/1.6 Arial, Helvetica, sans-serif;*/
    /*text-align:center;*/
    color:#333;
    /*color:#fff;*/
    background:#f0e800; /*黄色*/
    /*background:#00236f;*/
    /*-webkit-transform: rotate(-2deg) skew(-2deg);
    -moz-transform: rotate(-2deg) skew(-2deg);
    -o-transform: rotate(-2deg) skew(-2deg);
    -ms-transform: rotate(-2deg) skew(-2deg);
    transform: rotate(-2deg) skew(-2deg);*/
    -webkit-transform: rotate(-3deg) skew(-3deg);
    -moz-transform: rotate(-3deg) skew(-3deg);
    -o-transform: rotate(-3deg) skew(-3deg);
    -ms-transform: rotate(-3deg) skew(-3deg);
    transform: rotate(-3deg) skew(-3deg);
    text-shadow:1px 1px 0 rgba(255,255,255,1); 文字の影
    /*box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2),10px 0 0 0 #001968,-10px 0 0 0 #001968;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2),30px 0 0 0 #f0e800,-30px 0 0 0 #f0e800;*/
}

.tape a{
    color:#333; 
}

.tape a:hover{
    color:#333; 
}

/* テープ 青色
 * --------------------------- */
.tape2{
    /*width:1200px; 追加
    font-size:2.0em; */
    font-size:1.5em;
    position:relative;
    margin:20px 0 5px 0;
    /*margin:0 -1px;*/
    padding:10px;

/*    padding:10px 20px;*/
    /*padding:35px;*/
    /*font:bold 30px/1.6 Arial, Helvetica, sans-serif;*/
    /*text-align:center;*/
    color:#333;
    /*color:#fff;*/
    background:#79dbff; /*青色*/
    /*background:#00236f;*/
    /*-webkit-transform: rotate(-2deg) skew(-2deg);
    -moz-transform: rotate(-2deg) skew(-2deg);
    -o-transform: rotate(-2deg) skew(-2deg);
    -ms-transform: rotate(-2deg) skew(-2deg);
    transform: rotate(-2deg) skew(-2deg);*/
    -webkit-transform: rotate(-3deg) skew(-3deg);
    -moz-transform: rotate(-3deg) skew(-3deg);
    -o-transform: rotate(-3deg) skew(-3deg);
    -ms-transform: rotate(-3deg) skew(-3deg);
    transform: rotate(-3deg) skew(-3deg);
    text-shadow:1px 1px 0 rgba(255,255,255,1); 文字の影
    /*box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2),10px 0 0 0 #001968,-10px 0 0 0 #001968;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2),30px 0 0 0 #f0e800,-30px 0 0 0 #f0e800;*/
}

.tape2 a{
    color:#333; 
}

.tape2 a:hover{
    color:#333; 
}


/* 切り取り線
 * --------------------------- */
.cutoff_line{
    position:relative;
    /*padding:5px;
    margin-left:25px;*/
    padding:15px 5px 10px 5px;
    /*font:bold 24px/1.6 Arial, Helvetica, sans-serif;*/
    /*text-align:center;*/
    color:#655;
    border-top:1px dashed #aaa;
    border-bottom:1px dashed #aaa;
    background:#eee;
    text-shadow:1px 1px 0 rgba(255,255,255,1);
    box-shadow: 0 5px 4px -4px rgba(0,0,0,0.3) inset;
    font-size:1.0em;
}

/* かちかえし
 * --------------------------- */
.kachikaeshi{
    border-left: 12px solid #203744;
    text-shadow: 1px 1px 3px #000;
    color: #203744;
    font-size: 18pt;
    padding: 10px;
    box-shadow: 0 5px 2px -2px #203744;
}

/* 角丸右
 * --------------------------- */
.kadomaru_r{
	color: #fff;
	font-size: 1.2em;
	width: calc( 100% - 10px );
	border-radius: 0 30px 30px 0 / 0 30px 30px 0;
/*	box-shadow: 0 1px 10px 0 #69821b;*/
/*	text-shadow: 0 0 5px;padding: 10px;*/
/*	margin-left: 20px;*/
	padding: 10px 0px 10px 10px; /*追加*/
	background-color:#4e4d4d;
/*	background-color:#0075BA; 青系*/
	/* 紺色のグラデ
	background-color:#081742;
	background-image:-moz-linear-gradient(top, #081742, #2b385d);
	background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#081742), to(#2b385d));
	background-image:-webkit-linear-gradient(top, #081742, #2b385d);
	background-image:-o-linear-gradient(top, #081742, #2b385d);
	background-image:linear-gradient(to bottom, #081742, #2b385d);
	background-repeat:repeat-x;
	*/
}

/* リボン
 * --------------------------- */
.titlle_ribbon {
	position: relative;
	padding: .75em 1em;
	background-color: #f0f0f0;
}
.titlle_ribbon::before,
.titlle_ribbon::after {
	content: '';
	position: absolute;
	top: 100%;
	border-style: solid;
	border-color: transparent;
}
.titlle_ribbon::before {
	left: 0;
	border-width: 0 15px 15px 0;
	border-right-color: #ccc;
}
.titlle_ribbon::after {
	right: 0;
	border-style: solid;
	border-width: 15px 15px 0 0;
	border-top-color: #ccc;
}


/* リボン2
 * レスポンシブ対応しない
 * --------------------------- */
.titlle_ribbon2 {
	font-size:1.8em;
	font-weight:bold;
	position: relative;
	height: 50px;
	line-height: 50px;
	padding: 0 1em;
	color:#fff;
	/*background-color: #4e4d4d;*/
	background-color: #a7be18; 黄緑
	/*background-color: #ff705c; 濃いピンク*/
	/*background-color: #ff705c; 薄いグレー*/
}
.titlle_ribbon2::before,
.titlle_ribbon2::after {
	content: '';
	position: absolute;
}
.titlle_ribbon2::before {
	top: 100%;
	left: 0;
	border-width: 0 15px 15px 0;
	border-style: solid;
	border-color: transparent;
	/*border-right-color: #000;*/
	border-right-color: #707f13;
  /*border-right-color: #ccc;*/
}
.titlle_ribbon2::after {
	top: 0;
	right: 0;
	z-index: 2;
	border-width: 25px 20px;
	border-style: solid;
	border-color: transparent;
	border-right-color: #fff;
}


/* リボン3
 * --------------------------- */
.titlle_ribbon3{
	position:relative;
	margin:0 -10px 0 -10px;
	padding:10px 20px;
	background:#88ccef;
	box-shadow:
		0 3px 3px 0 rgba(0,0,0,0.1);
}
.titlle_ribbon3:before{
	content:" ";
	position:absolute;
	top:100%;
	left:0;
	width:0;
	height:0;
	border-width:0 10px 10px 0;
	border-style:solid;
	border-color:transparent;
	border-right-color:#7bb8d8;
}
.titlle_ribbon3:after{
	content:" ";
	position:absolute;
	top:100%;
	right:0;
	width:0;
	height:0;
	border-width:10px 10px 0 0;
	border-style:solid;
	border-color:transparent;
	border-top-color:#7bb8d8;
}

/* リボン　左折れ
 * ----------------- */
.title_ribbon4{
	font-size:1.8em;
	font-weight:bold;
	position: relative;
	padding: 0.5em;
	background: #a7be18;
	color: white;
}
.title_ribbon4:before {
	position: absolute;
	content: '';
	top: 100%;
	left: 0;
	border: none;
	border-bottom: solid 15px transparent;
	border-right: solid 20px rgb(149, 158, 155);
}
/* シンプル
 * --------------------------- */
.simple{
	width:100%;
	color: #111;
	font-size: 2em;
	font-weight: bold;
	font-family: "ＭＳ 明朝",serif; 
	margin: 1em 0px 1em 0;
	padding-left: 0.3em;
/*	border-bottom: 2px solid #B92A2C;
	border-bottom: 2px solid #00236f;
	box-shadow: 0 1px 0 #aaaaaa;
	-webkit-box-shadow: 0 1px 0 #aaaaaa;
	-moz-box-shadow: 0 1px 0 #aaaaaa; */
	text-shadow: #999999 0px 1px 1px;
}
.simple a{
	text-decoration: none;
}
.simple a:hover{
	color: #E79723;
	text-decoration: none;
}


/* 付箋 */
.fusen {
/*	width:70%;*/
	background:#eaf4fc;
/*	font-size:18pt;*/
/*	color:#164a84;*/
	-webkit-box-shadow:1px 1px 1px 1px rgba(0,0,0,0.1),15px 15px 0 -5px #eaf4fc,15px 15px 1px -4px rgba(0,0,0,0.2);
	-moz-box-shadow:1px 1px 1px 1px rgba(0,0,0,0.1),15px 15px 0 -5px #eaf4fc,15px 15px 1px -4px rgba(0,0,0,0.2);
	box-shadow:1px 1px 1px 1px rgba(0,0,0,0.1),15px 15px 0 -5px #eaf4fc,15px 15px 1px -4px rgba(0,0,0,0.2);
/*	padding:10px; */
	padding:15px;
}

/* 旗 */
.title_flag{
	position:relative;
	margin:10px 0px 10px 15px;
	padding:10px 15px 10px 10px;
	font-weight:bold;
/*	font-size:1.0em;*/
/*	font:bold 22px/1.2 Arial, Helvetica, sans-serif;*/
	color:#fff;
	background:#c33;
}

.title_flag:before{
    content:"<";
    position:absolute;
    top:middle;
    left:-10px;
    width:0;
    height:0;
    /*font-size:25px;*/
    line-height:1.0;
    color:#c96;
}

.title_flag:after{
    content:" ";
    position:absolute;
    top:-2px;
    left:-10px;
    width:0;
    height:130%;
    border:#600 solid 2px;
    border-radius:2px;
    -webkit-transform: rotate(-2deg);
    -moz-transform: rotate(-2deg);
    -o-transform: rotate(-2deg);
    transform: rotate(-2deg);
}

/* 追加ＣＳＳ　旗の色 */
.iro-blue{
    background:#06c;
}
.iro-red{
    background:#c33;
}
.iro-yellow{
    background:#FFCC33;
}

.iro-green{
    background:#097900;
}

.iro-ygreen{
    background:#a7be18;
}

.iro-pink{
    background:#ff705c;
}

.iro-gry{
    font-size:1.5em;
    background:#4e4d4d;
}

.iro-mizuiro{
    background:#59b1eb;
}

.iro-orange{
    background:#ff8300;
}

.iro-cream{
    background:#fff8a9;
    color:#000;
}

/* アメリカンな(?)吹き出し */
.america{
    width: 100%; /*追加 */
    position:relative;
    padding:10px 5px 10px 5px;
    /*font:bold 28px/1.6 Arial, Helvetica, sans-serif; */
    color:#0075BA;
    background:#fff;
    /*text-shadow:
        1px 1px 0 #fff,
        2px 2px 0 #999;*/
    border-top:#0075BA solid 3px;
    border-bottom:#0075BA solid 3px;
    background-image: -webkit-gradient(linear, left top, right bottom,
            from(           rgba(255, 255, 255, 0.0)),
            color-stop(0.4, rgba(255, 255, 255, 0.0)),
            color-stop(0.4, rgba(0, 0, 0, 0.1)),
            color-stop(0.6, rgba(0, 0, 0, 0.1)),
            color-stop(0.6, rgba(255, 255, 255, 0.0)),
            to(             rgba(255, 255, 255, 0.0))
            );
    background-image: -webkit-linear-gradient(top -45deg,
            transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
            );
    background-image: -moz-linear-gradient(top -45deg,
            transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
            );
    background-image: -o-linear-gradient(top -45deg,
            transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
            );
    background-image: linear-gradient(to bottom -45deg,
            transparent 40%,
            rgba(0, 0, 0, 0.1) 40%,
            rgba(0, 0, 0, 0.1) 60%,
            transparent 60%
            );
    background-size:4px 4px;
}

.america:before{
    content:" ";
    position:absolute;
    top:100%;
    left:24px;
    width:0;
    height:0;
    border-width:12px;
    border-style:solid;
    border-color:transparent;
    border-top-color:#0075BA;
}

.america:after{
    content:" ";
    position:absolute;
    top:100%;
    left:28px;
    width:0;
    height:0;
    border-width:8px;
    border-style:solid;
    border-color:transparent;
    border-top-color:#f0f0f0;
    z-index:1;
}


/* 付箋2 */
.fusen2{
    position:relative;
    /*margin:0 22px 0 10px;
    padding:14px 15px 0px 20px;*/
    font-size:1.1em;
    margin:5px 15px 5px 10px;
    padding:15px 5px 30px 15px;
    /*font:normal 24px/1.3 serif;
    color:#009;
    background:#ffc;
    box-shadow:
        12px 0 0 0 #ffc,
        0 12px 0 0 #ffc,
        1px 15px 4px -3px rgba(0,0,0,0.2);*/
    background: #fffbe6;
	  /*background: #fff8a9;*/
    box-shadow:
        12px 0 0 0 #fffbe6,
        0 12px 0 0 #fffbe6,
        /*12px 0 0 0 #fff8a9,
        0 12px 0 0 #fff8a9,
        12px 0 0 0 #eaf4fc,
        0 12px 0 0 #eaf4fc,*/
        1px 15px 4px -3px rgba(0,0,0,0.2);
}

.fusen2:before{
    content:" ";
    position:absolute;
    top:100%;
    left:100%;
    width:0;
    height:0;
    border-width:12px 12px 0 0;
    border-style:solid;
    border-color:transparent;
    /*border-top-color:#cc9;*/
    border-top-color:#c8c8c8;
}

/*.fusen2:after{
    content:" ";
    position:absolute;
    padding:0 20px;
    bottom:0;
    left:10px;
    width:120px;
    height:20px;
    background:rgba(255,182,182,0.4);
    -webkit-transform: rotate(-1deg); 
    -moz-transform: rotate(-1deg);
    -o-transform: rotate(-1deg);
    transform: rotate(-1deg);
}*/


/* メモ帳風　*/
.blockquote {
  background:#eaf4fc; 
  /*background:#fffbe6; クリーム色*/
  /* background: #eee url(http://www.webcreatorbox.com/sample/images/quote.gif) no-repeat 10px 10px ;*/
  padding: 15px;
  /*padding: 25px;*/
  /*font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Meiryo,"メイリオ",Helvetica,Sans-Serif;*/

  /*box-shadow: 5px 5px 10px #000;  ボックスシャドウ 
    -webkit-box-shadow: 5px 5px 10px #000;
    -moz-box-shadow: 5px 5px 10px #000;*/ 
}


.blockquote li {
  list-style-type : none;
  padding:5px 10px;
  border-bottom:1px solid #84b2e0;
}


/* ポストイット風 */
.gracias{
    position:relative;
    margin:10px 0 10px 0; /* 追加したCSS */
    /*margin:0 10px;*/
    padding:0 10px 0 55px;
    font:bold 1.2em/2.4em Arial, Helvetica, sans-serif;
    /*font:bold 22px/40px Arial, Helvetica, sans-serif;*/
    /*color:#666;*/
    background:#f3f3f3;
    z-index:1;
}

.gracias:before{
    content:" ";
    position:absolute;
    top:0;
    left:0;
    width:40px;
    height:40px;
    border-right:#fff solid 2px;
    /*background:#f60; 一番濃い朱色 */
    background:#33CCCC;
    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%,1
            rgba(255, 255, 255, 0.5) 80%,
            rgba(255, 255, 255, 0.6) 80%,
            rgba(255, 255, 255, 0.6) 100%
            );
            z-index:-1;
}

.gracias: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;
}

/* 下線 */
.title_bottom {
	margin-bottom:0.5em;
	padding:2px 5px;
	/*color:#e78f00;
	font-size:16px;*/
	border-bottom:1px solid #000;
}

.title_stripe:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 100%;
  height: 7px;
  background: -webkit-repeating-linear-gradient(-45deg, #6ad1c8, #6ad1c8 2px, #fff 2px, #fff 4px);
  background: repeating-linear-gradient(-45deg, #6ad1c8, #6ad1c8 2px, #fff 2px, #fff 4px);
}

/* 黒背景 */
.title_kuro {
  padding: 15px 20px 10px 20px;
	color:#fff;
  /*background:#bd89c2;*/
  background:#333;
}

/* 手書き風　囲い枠 */
.title_tegaki {
	padding: 1em;
	border: 3px solid #ccc;
	border-radius: 3em .7em 2em .7em/.7em 2em .7em 3em;
}

/* 布縫い目 */
.title_nuime{
  color:#000;
  /*font-size:1.25em; 追加ＣＳＳ*/
	background: #dfefff;
	box-shadow: 0px 0px 0px 5px #dfefff;
	border: dashed 2px white;
	padding: 0.2em 0.5em;
  margin:1em 0.2em 1em 0.2em; /*追加ＣＳＳ*/
}



/* 布縫い目 個人*/
.title_nuime_k{
  color:#fff;
  font-size:1.25em; /*追加ＣＳＳ*/
	background: #ff705c;
	box-shadow: 0px 0px 0px 5px #ff705c;
	border: dashed 2px white;
	padding: 0.2em 0.5em;
  margin:1em 0.2em 1em 0.2em; /*追加ＣＳＳ*/
}

.title_nuime_k a{
 color:#fff;
 text-decoration: none;
}

.title_nuime_k a:hover{
  color:#23527c;
	background: #ff705c;
	/*box-shadow: 0px 0px 0px 5px #ff705c;
	border: dashed 2px white;*/
	padding: 0.2em 0.5em;
  margin:1em 0.2em 1em 0.2em; /*追加ＣＳＳ*/
 text-decoration: none;
}

/* 布縫い目 自治会*/
.title_nuime_j{
  color:#fff;
  font-size:1.25em; /*追加ＣＳＳ*/
	background: #59b1eb;
	box-shadow: 0px 0px 0px 5px #59b1eb;
	border: dashed 2px white;
	padding: 0.2em 0.5em;
  margin:1em 0.2em 1em 0.2em; /*追加ＣＳＳ*/
}

.title_nuime_j a{
 color:#fff;
 text-decoration: none;
}

.title_nuime_j a:hover{
  color:#23527c;
	background: #59b1eb;
	/*box-shadow: 0px 0px 0px 5px #ff705c;
	border: dashed 2px white;*/
	padding: 0.2em 0.5em;
  margin:1em 0.2em 1em 0.2em; /*追加ＣＳＳ*/
 text-decoration: none;
}

/* 布縫い目 グループ*/
.title_nuime_g{
  color:#fff;
  font-size:1.25em; /*追加ＣＳＳ*/
	background: #a7be18;
	box-shadow: 0px 0px 0px 5px #a7be18;
	border: dashed 2px white;
	padding: 0.2em 0.5em;
  margin:1em 0.2em 1em 0.2em; /*追加ＣＳＳ*/
}

.title_nuime_g a{
 color:#fff;
 text-decoration: none;
}

.title_nuime_g a:hover{
  color:#23527c;
	background: #a7be18;
	/*box-shadow: 0px 0px 0px 5px #ff705c;
	border: dashed 2px white;*/
	padding: 0.2em 0.5em;
  margin:1em 0.2em 1em 0.2em; /*追加ＣＳＳ*/
 text-decoration: none;
}

/* 布縫い目 企業 */
.title_nuime_c{
  color:#fff;
  font-size:1.25em; /*追加ＣＳＳ*/
	background: #14ce58;
	box-shadow: 0px 0px 0px 5px #14ce58;
	border: dashed 2px white;
	padding: 0.2em 0.5em;
  margin:1em 0.2em 1em 0.2em; /*追加ＣＳＳ*/
}

.title_nuime_c a{
 color:#fff;
 text-decoration: none;
}

.title_nuime_c a:hover{
  color:#23527c;
	background: #14ce58;
	/*box-shadow: 0px 0px 0px 5px #ff705c;
	border: dashed 2px white;*/
	padding: 0.2em 0.5em;
  margin:1em 0.2em 1em 0.2em; /*追加ＣＳＳ*/
 text-decoration: none;
}


/* ステッチ */
.title_stitch{
  /*font-size:1.25em; 追加ＣＳＳ*/
  background: #f0f0f0;
  box-shadow: 0px 0px 0px 5px #f0f0f0;
  border: dashed 1px #c8c8c8;
   /*background: #dfefff;
  box-shadow: 0px 0px 0px 5px #dfefff;
  border: dashed 1px #96c2fe;*/
  padding: 0.2em 0.5em;
  margin:1.2em 0.5em 1em 0.5em; /*追加ＣＳＳ*/
  color: #454545;
}

/*背景に蛍光ペンみたいなライン引く*/
.title-line {
  background: linear-gradient(transparent 10%, #fff001 0%); /* 0%が一番太い　90%細くなる*/
}

/*角がくるん*/
.title-kadokurun{
  position: relative;
  padding: 0.25em 1em;
  margin: 1.5em 1em 0.25em 1em;
  border: solid 2px black;
  border-radius: 3px 0 3px 0;
}

/*.title-kadokurun:before,title-kadokurun:after{
  content: '';
  position: absolute;
  width:10px;
  height: 10px;
  border: solid 2px black;
  border-radius: 50%;
}

.title-kadokurun:after {
  top:-12px;
  left:-12px;
}
.title-kadokurun:before {
  bottom:-12px;
  right:-12px;
}*/


/* 下線（２色） */
.kasen-w{
  border-bottom: solid 3px #00ad92;
  position: relative;
}

.kasen-w:after{
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #fc2e14;
  bottom: -3px;
  width: 30%;
}

/* 下線（グラデーション色） */
.kasen-g{
  position: relative;
  padding: 0.25em 0;
}

.kasen-g:after{
  content: "";
  display: block;
  height: 4px;
  background: -webkit-linear-gradient(to right, rgb(255, 186, 115), #ffb2b2);
  background: linear-gradient(to right, rgb(255, 186, 115), #ffb2b2);
}


/* ▲を重ねる */
.sankaku {
    margin:  0;                     /* デフォルトCSS打ち消し */
   /* font-size:  24px;                文字サイズ指定 */
    position:  relative;            /* 位置調整 */
    font-weight:  normal;           /* 文字の太さ調整 */
    margin-bottom: 30px;            /* 周りの余白指定 */
    padding-top: 40px;              /* 余白指定 */
    padding-left: 15px;             /* 余白指定 */
}
/*
p {
    margin:  0;                     デフォルトCSS打ち消し
    line-height: 2;                 行間調整
    padding-left:  40px;             余白指定
} */
.sankaku:before {
    content:  '';                   /* 空白の要素を作る */
    width: 0;                       /* 幅指定 */
    height: 0;                      /* 高さ指定 */
    border-style: solid;            /* 三角を作る */
    border-width: 0px 0 110px 80px; /* 三角を作る */
    border-color: transparent transparent #a3d0e4 transparent;  /* 三角を作る */
    position:  absolute;            /* 位置調整 */
    z-index:  -1;                   /* 重なり調整 */
    transform: rotate(30deg);       /* 回転 */
    top: -20px;                     /* 位置調整 */
    left: 30px;                     /* 位置調整 */
}


/* 〇を重ねる トップページ*/
.maru {
    margin:  0;             /* デフォルトCSS打ち消し */
    position:  relative;    /* 位置調整 */
    font-weight:  normal;   /* 文字の太さ調整 */
    margin-bottom: 35px;    /* 周りの余白指定 */
    /* font-size: 40px;        文字サイズ指定 */
    text-align:  center;    /* 文字位置指定 */
    padding-top: 50px;      /* 余白指定 */
}
/*
p {
    margin:  0;             デフォルトCSS打ち消し 
    line-height: 2;          行間調整 
}*/
.maru:before {
    content: '';            /* 空の要素を作る */
    width: 120px;           /* 幅指定 */
    height: 120px;          /* 高さ指定 */
    border-radius:  50%;    /* 丸くする */
    border: solid #ccc;     /* 枠線指定 */
    display:  block;        /* ブロック要素にする */
    position:  absolute;    /* 位置調整 */
    left:  0;               /* 位置調整 */
    right:  0;              /* 位置調整 */
    margin:  auto;          /* 位置調整 */
    top: 0;                 /* 位置調整 */
    z-index: -1;            /* 重なり調整 */
}
.maru:after {
    content: '';            /* 空の要素を作る */
    width: 110px;           /* 幅指定 */
    height: 110px;          /* 高さ指定 */
    border-radius:  50%;    /* 丸くする */
    border: 1px solid #ccc; /* 枠線指定 */
    display:  block;        /* ブロック要素にする */
    position:  absolute;    /* 位置調整 */
    left:  0;               /* 位置調整 */
    right:  0;              /* 位置調整 */
    margin:  auto;          /* 位置調整 */
    top: 7px;               /* 位置調整 */
    z-index: -1;            /* 重なり調整 */
}

/* 手書き風下線 サブページ*/
.kasen {
    margin:  0;             /* デフォルトCSS打ち消し */
    /*font-size:  24px;        文字サイズ指定 */
    position:  relative;    /* 位置調整 */
    font-weight:  strong;   /*文字の太さ調整 */
    margin: 50px 0 30px 0;
    padding-bottom: 15px ; 
    /*margin-bottom: 15px;     周りの余白指定 */
    border-bottom: solid 4px rgba(76, 175, 80, 0.6);        /* 線指定 */
    border-radius: 0px 0px 160px 180px/0px 0px 20px 4px;    /* 角丸指定 */
    border-color: #3e59a8 ;
}
/*
p {
    margin:  0;          デフォルトCSS打ち消し */
    line-height: 2;      行間調整 
}*/


/* 最初の文字だけ大きくする */
.big {
    margin:  0;             /* デフォルトCSS打ち消し */
    /* font-size:  24px;       文字サイズ指定 */
    position:  relative;    /* 位置調整 */
    font-weight:  normal;   /* 文字の太さ調整 */
    margin-bottom: 15px;    /* 周りの余白指定 */
}
/*
p {
    margin:  0;              デフォルトCSS打ち消し 
    line-height: 2;          行間調整 
}*/
.big-point {
      font-size:  50px;     /* 文字サイズ指定 */
}

/* 下線　シンプル */
.u_line {
    margin:  0;             /* デフォルトCSS打ち消し */
    /* font-size:  24px;       文字サイズ指定 */
    border-bottom:  solid;  /* 線指定 */
    margin: 50px 0 15px 0;
    padding-bottom: 5px ;
    /*padding-bottom:  5px;    余白指定 */
    /* margin-bottom: 15px;    周りの余白指定 */
}
/*
p {
    margin:  0;              デフォルトCSS打ち消し
    line-height: 2;          行間調整 
}*/


/* ======== 囲み枠 ======== */
/* 二重線 */
.box_w {
    padding: 1em;
    margin: 2em 0;
    margin-top: 1.2em;
    /*padding: 0.5em 1em;
    margin: 2em 0;*/
    border: double 5px #4ec4d3;
    background: #f4f4f4;
    font-size:0.9em;
}
.box_w p {
    margin: 0; 
    padding: 0;
}

/* 上にだけ太線 */
.box_topb {
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #ff7d6e;
    background: #ffebe9;
    border-top: solid 10px #ff7d6e;
}
.boxtopb p {
    margin: 0; 
    padding: 0;
}


/* 破線のボックス */
.box_hasen {
    padding: 0.5em 1em;
    margin: 2em 0;
    background: #f0f7ff;
    border: dashed 2px #5b8bd0;/*点線*/
}
.box_hasen p {
    margin: 0; 
    padding: 0;
}