@charset "UTF-8";

/*================================================
 *  #mainNavi　ついてくるメニュー
 ================================================*/
#mainNavi{
	clear: both;/* ロゴTEL回り込み解除 */
	display:block;
	width:100%;
	z-index:999;}

	/*ついてきている時*/
    #mainNavi.active{
	   display:block;
	   position:fixed;
	   top:0;
	   left:0;}

/*上にスクロールで表示　下スクロールで隠れる*/
    .site-header{
        transition: .5s;}
 
    .site-header.hide{
        transform: translateY(-100%);}



.shad{/*　shadowをいれる　*/
	box-shadow: 3px 3px 7px #808080;
	-webkit-box-shadow: 3px 3px 7px #808080;
	-moz-box-shadow: 3px 3px 7px #808080;}

.sage a:hover {/*　下げる　*/
    top:1px; left:1px;
    position:relative;}

.mini{
    font-size: 80%;}


/*================================================
 *  tabmenu　タブ式メインメニュー
 ================================================*/

.tabmenu{
	width: 100%;}

	.tabmenu > ul {/*本メニュー幅*/
		margin: 0 auto;
		width: 100%;
		max-width:1024px;
		height: auto;
		text-align: center;}

	.tab{
		overflow:hidden;
		margin:0;
		padding: 0;
		list-style: none;}

	.tab li{
		cursor: pointer;
		display: inline-block;
		width: 19%;
		max-width:200px;/*画像1つの幅*/
		border: #fff 2px solid;
		-webkit-border-radius: 5px;/* 角丸for Safari and Chrome 対応*/
		-moz-border-radius: 5px;/* 角丸for Firefox 対応*/}
		
     /*==== ■スマホ(幅767px以下)■ ==========*/
        @media screen and (max-width: 767px) {
     		.tab{
			     display: table;
			     table-layout: fixed;
			     width: 100%;
			     min-width: 146px;}
            .tab li{
			     display: table-cell;
			     vertical-align: middle;
			     width: 20%;
			     height: auto;
			     border: #fff 1px solid;
			     -webkit-border-radius: 0px;/* 角丸for Safari and Chrome 対応*/
			     -moz-border-radius: 0px;/* 角丸for Firefox 対応*/}}
    /*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


/*li 順番に背景指定*/
.tab li:nth-child(1){
	background: #00984b;}
.tab li:nth-child(2){
	background: #00a5e7;}
.tab li:nth-child(3){
	background: #FF99B3;}
.tab li:nth-child(4){
	background: #FFB319;}
.tab li:nth-child(5){
	background: #c50030;}

/* ポイント時 */	
	.tab li:hover {
		background:#583822;}					

/* 選択時に吹き出し風 */
		.tab li.select {
			position: relative;
			display: inline-block;
			margin: 0 0 0.5em 0;/* 下が上がる */
			max-width: 100%;
            min-width: 50px;
			font-size: 1.6em;/*                                                     フォントサイズ 1.6em;*/
			background: #583822;
            border: solid 1.5px #583822;
			box-sizing: border-box;}

		.tab li.select:after{
			content: "";
			position: absolute;
			bottom: -25px;
			left: 50%;
			margin-left: -17px;
			border: 12px solid transparent;
			border-top: 12px solid #583822;
			z-index: 1;}

		.tab li.select p {
			margin: 0;
			padding: 0;}
			

   /*==== ■(幅767px以下)■ ==========*/
        @media screen and (max-width: 767px) {
     		.tab .select {
                display: table;
                table-layout: fixed;
                margin: 0;
                width: 100%;}
            
                 /*==== ■(幅480px以下)■ ==========*/
                    @media screen and (max-width: 480px) {
                        .tab .select {min-width: 80px;}}

                /*::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
            
            .tab li .select {
                display: table-cell;
                vertical-align: middle;
                width: 20%;
                height: auto;
                background: #583822;
                border: #583822 1px solid;
                -webkit-border-radius: 0px;/* 角丸for Safari and Chrome 対応*/
                -moz-border-radius: 0px;/* 角丸for Firefox 対応*/}

/*吹き出し▼*/
  		    .tab li.select:before{
                bottom: -19px;
                margin-left: -15px;
                border: 10px solid transparent;
                border-top: 10px solid #583822;}

            .tab li.select:after{
                bottom: -21px;
                margin-left: -17px;
                border: 12px solid transparent;
                border-top: 12px solid #583822;}}


/*================================================
 *  content　メインメニュー　内容表示
 ================================================*/

/* 内容表示 */
.content div{
    margin: 0 auto;
    padding: 0;
    max-width: 100%;
    max-width:1024px;
    height: auto;}

/* クリックしてない時は非表示 */
	.hide{
		display:none;}

/* 内容表示 囲み　木枠*/
        .content div.sub{
            overflow: hidden;
            background: none;
            height: auto;
            overflow: auto;
            overflow-x: hidden;
            max-height: 60vh;
            margin: 0;
            background-color: #eee8aa;
            /*background-image: url("../img/000-all/002-menu.gif");*/
            background-repeat: repeat-y;
            background-attachment: fixed;
            background-size:100% auto;
            border: #fff solid 6px;
            border-image: url("../img/000-all/005-waku.jpg") 24 24 round;}

                /*==== ■(幅820px以下)■ ==========*/
                    @media screen and (max-width: 820px) {
                        .content div.sub{
                            padding: 0 0.5em;
                            max-height: 70vh;}}

                /*==== ■(幅420px以下)■ ==========*/
                    @media screen and (max-width: 420px) {
                        .content div.sub{
                            max-height: 75vh;
                            border: #fff solid 0px;}}

                /*::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


/*HOME戻る　閉じるボタン 囲み枠*/
     .content div.m-bt{
        width:100%;
        background: #583822;}

                ul.m-bt2{padding: 0 0 0 21%;}

                    /*==== ■(幅767px以下)■ ==========*/
                        @media screen and (max-width: 767px) {
                            ul.m-bt2{padding: 0 0 0 5%;}}

                    /*==== ■(幅480px以下)■ ==========*/
                        @media screen and (max-width: 480px) {
                            ul.m-bt2{padding: 0 0 0 1%;}}

                    /*::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

                ul.m-bt2 li{
                    margin: 0;
                    padding: 0.5em 1.5em;
                    width:30%;}

                    /*==== ■(幅767px以下)■ ==========*/
                        @media screen and (max-width: 767px) {
                            ul.m-bt2 li{
                                width:40%;}}

                    /*::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


/* HOME戻る　閉じるボタン */
        .content .homebt, .content .close{
            margin: 0 auto;
            padding: 0.5em;
            width:100%;
            font-size: 1.5em;
            font-weight: bold;
            -webkit-border-radius:4px;
            border-radius: 4px;
            text-align: center;
            cursor: pointer;}


/* HOME戻るボタン */
       .content .homebt{
           color: #7f4f21;
            background: #f39800;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #feda71), color-stop(0.5, #febe4d));
            background: -moz-linear-gradient(top, #feda71 50%,#febe4d 50%);
            background: -o-linear-gradient(top, #feda71 50%,#febe4d 50%);
            background: -ms-linear-gradient(top, #feda71 50%,#febe4d 50%);
            background: linear-gradient(top, #feda71 50%, #febe4d 50%);
            filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#feda71 50%', endColorstr='#febe4d 50%');
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#feda71 50%', endColorstr='#febe4d 50%')";}



/*　下げる　*/
                .content .close:hover {
                        top:1px; left:1px;
                        position:relative;}


/*初めての方へ等のボタン*/
div.m-list-sabu{
    margin: 0;
    padding: 0.5%;
    width: 100%;}


/*1個の大きさ 4列*/
        ul.m-list-04 li {
            padding: 0.5%;
            width: 23.5%;}


		/*::::::: ■(幅767px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 767px) {
                div.m-list-sabu{
                    width: 98.5%;}
                
				ul.m-list-04 li {
                    padding: 0.5% 1%;
                    width: 31%;}}

		/*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 480px) {
				ul.m-list-04 li {
                    padding: 0 1%;
                    width: 48%;}}

/*================================================
 *  利用ガイド に使用
 ================================================*/

/*利用ガイドメニュー　親　全体囲み*/
div.mein-menu01{
    overflow: hidden;
    margin:0 auto;
    padding:0;
    font-size: 1.5em;
    text-align:left;}

/*子　囲み*/				
ul.m-list-02 li {width: 25%;}			

		/*:::::::: ■タブレット(幅820px以下)■ ::::::::::::*/
			@media screen and (max-width: 820px) {				
                ul.m-list-02 li {width: 50%;}}

		/*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 480px) {				
                ul.m-list-02 li {width: 100%;}}

		/*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


/*個別メニュー　外囲み枠*/
.content div.title01 {
    position: relative;
    margin:0;
    padding:0;}



/*テープ　タイトル画像用枠*/
        .content div.title01 .tep-title {
            position: absolute;
            display: inline-block;
            top: -20px;
            left: 15px;
            padding: 0px;
            width: 85%;}

                /*::::::: ■(幅820px以下)■ ::::::::::::::::::*/
			         @media screen and (max-width: 820px) {
                        .content div.title01 .tep-title {
                            left: 15px;
                            width: 55%;}}

               /*::::::: ■(幅767px以下)■ ::::::::::::::::::*/
			         @media screen and (max-width: 767px) {
                        .content div.title01 .tep-title {
                            top: -17px;
                            left: 15px;
                            width: 60%;}}

              /*::::::: ■(幅630px以下)■ ::::::::::::::::::*/
			         @media screen and (max-width: 630px) {
                        .content div.title01 .tep-title {
                            top: -18px;
                            left: 15px;
                            width: 75%;}}

		      /*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
			         @media screen and (max-width: 480px) {
                        .content div.title01 .tep-title {
                            position: absolute;
                            display: inline-block;
                            top: -15px;
                            left: 0px;
                            width: 45%;
                            padding: 0 10px;}}

		      /*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/



/*メニュー囲み枠*/
ul li ul.m-list-03{
    margin: 25px 5px 10px;
    padding: 30px 0 10px 5px;
    background-color: #fff;
	border: 1.5px #ddd solid;}    

		/*::::::: ■(幅767px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 767px) {
                    ul li ul.m-list-03{
                        margin: 20px 2px 5px;
                        padding: 28px 0 10px 10px;}}

		/*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 480px) {
                    ul li ul.m-list-03{/*メニュー囲み*/
                        margin: 18px 0px 8px;
                        padding: 25px 0 10px 2px;}}

		/*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


/*個別メニューリスト*/
    ul li ul.m-list-03 li{
        position:relative;
        margin: 0 0 0 6px;
        padding: 0 0 0 15px;
        width: 85%;
        line-height:1.8;
        border-bottom: 1px dashed #9F99A3;}


        /*:::::::: ■タブレット(幅820px以下)■ ::::::::::::*/
			 @media screen and (max-width: 820px) {
                    ul li ul.m-list-03 li {width: 86%;}}

        /*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 480px) {				
				    ul li ul.m-list-03 li {
                        width: 43%;
                        font-size: 105%;
                        line-height:2.2;}}

        /*::::::: ■スマホ(幅360px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 360px) {               
                ul li ul.m-list-03 li {
					width: 100%;
                    font-size: 80%;}}

		/*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


            ul li ul.m-list-03 li a{
                display: block;}

            /*ul li ul.m-list-03 li:hover{
                background-color: #583822;
                color: #fff;}*/

            ul li ul.m-list-03 li a:hover{
                display: block;
                font-weight: bold;
                /*background-color: #583822;*/
                color: red;}

/*子メニュー▲*/
			ul li ul.m-list-03 li:before{
				counter-increment: list;
                content: "";
                display: block;
                position: absolute;
                left: 3px;
                height: 0;
                width: 0;
                border-top: 4px solid transparent;
                border-bottom: 4px solid transparent;
                border-left: 7px solid #FFB319;
                top: 50%;
                -moz-transform: translateY(-50%);
                -webkit-transform: translateY(-50%);
                -o-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                transform: translateY(-50%);}

/*================================================
 *  Tシャツ・ウェアメニュー に使用
 ================================================*/
/*ご注文の流れ・アイテム一覧　文字枠*/
div .tkate{
    display: inline-block;
    margin: 1%;
    width: 98%;
    background-color: #29aae1;}

/*ご注文の流れ　文字イメージ*/
                .tkate-01{
                    width: 100%;
                    max-width: 30em;}
/*アイテム一覧　文字イメージ*/
                .tkate-02{
                    width: 100%;
                    max-width: 20em;}

/*ご注文の流れ画像リンク*/
.step{
    margin: 0 2% 10px;}

/*オリジナル1個の大きさ 5列*/
ul.m-list-05-1 {
        margin-bottom: 2em;
        padding: 0.5%;}

/*オリジナル1個の大きさ 5列*/
ul.m-list-05-1 li {
        padding: 0.5%;
        width: 19%;}

		/*::::::: ■(幅767px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 767px) {
               	ul.m-list-05-1 li {
                    width: 24%;}}

		/*::::::: ■(幅600px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 600px) {
               	ul.m-list-05-1 li {
                    width: 32%;}}

		/*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 480px) {
                .step{
                    margin: 0 0 10px;}
                
				ul.m-list-05-1 li {
                    width: 48%;}}
        /*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


/* カテゴリ　ボタン */
       .toi-bt{
            margin: 0 auto;
            padding: 0.5em;
            width:90%;
            font-size: 1.4em;
            font-weight: bold;
            -webkit-border-radius:4px;
            border-radius: 4px;
            text-align: center;
            cursor: pointer;}


		/*::::::: ■(幅480px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 480px) {

                .toi-bt{
                    margin: 0.2em auto 0.7em;
                    font-size: 1.6em;}}








/*================================================
 *  オリジナルグッズ・一般印刷メニュー に使用
 ================================================*/
/*オリジナルカテゴリリスト画像囲み*/
div.m-list-kate{
    float: left;
    overflow: hidden;
    margin: 0.5%;
    padding:0;
    width: 76%;}

       ul.m-list-05 li {/*オリジナル1個の大きさ 3列*/
            padding: 0.5%;
            width: 24%;}

		/*::::::: ■(幅767px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 767px) {
               	div.m-list-kate{/* コンテンツ並べる 解除*/
				    float: none;
                    width: 100%;}}

		/*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 480px) {  
				ul.m-list-05 li {
                    width: 48%;}}
        /*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/



div.m-list-osu{/*一般カテゴリ・今月のおすすめ*/
    float: right;
    overflow: hidden;
    margin:  0.5% 0.3% 0.5% 0.5%;
    padding: 0;
    width: 22%;
    font-size: 1.6em;}

    ul.cols-1 li {width: 100%;/*右一般*/ }


		/*::::::: ■(幅767px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 767px) {
               	div.m-list-osu{/* コンテンツ並べる 解除*/
				    float: none;
                    width: 100%;}
                ul.cols-1 li {/*右一般*/
                    width: 100%;}}
        /*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


/*テープ　タイトル画像用枠*/
        div.m-list-osu div.title01 .tep-title {
            top: -17px;
            left: 15px;
            width: 85%;}

                /*::::::: ■(幅820px以下)■ ::::::::::::::::::*/
			         @media screen and (max-width: 820px) {
                         div.m-list-osu div.title01 .tep-title {
                            left: 10px;
                            width: 90%;}}
                /*::::::: ■(幅767px以下)■ ::::::::::::::::::*/
			         @media screen and (max-width: 767px) {
                         div.m-list-osu div.title01 .tep-title {
                             top: -25px;
                            left: 15px;
                            width: 30%;}}

                /*::::::: ■(700幅px以下)■ ::::::::::::::::::*/
			         @media screen and (max-width: 700px) {
                         div.m-list-osu div.title01 .tep-title {
                             top: -20px;
                            left: 15px;
                            width: 32%;}}

                /*::::::: ■(幅600px以下)■ ::::::::::::::::::*/
			         @media screen and (max-width: 600px) {
                         div.m-list-osu div.title01 .tep-title {
                             top: -20px;
                            left: 15px;
                            width: 35%;}}

		      /*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
			         @media screen and (max-width: 480px) {
                         div.m-list-osu div.title01 .tep-title {
                            top: -18px;
                            left: 5px;
                            padding: 0 10px;
                         width: 45%;}}

		      /*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/



/*メニュー囲み枠*/
 div.m-list-osu ul li ul.m-list-03{
    margin: 20px 5px 10px;
    padding: 25px 0 10px 0px;}    

		/*::::::: ■(幅767px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 767px) {
                   div.m-list-osu ul li ul.m-list-03{
                        margin: 20px 2px 5px;
                        padding: 20px 0 10px 5px;}}

		/*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 480px) {
                    div.m-list-osu ul li ul.m-list-03{/*メニュー囲み*/
                        margin: 18px 0px 8px;
                        padding: 25px 0 10px 2px;}}

		/*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


/*個別メニューリスト*/
    div.m-list-osu ul li ul.m-list-03 li{
        position:relative;
        margin: 0 0 0 6px;
        padding: 0 0 0 15px;
        width: 85%;}


        /*:::::::: ■タブレット(幅820px以下)■ ::::::::::::*/
			 @media screen and (max-width: 820px) {
                    div.m-list-osu ul li ul.m-list-03 li {width: 80%;}}

        /*:::::::: ■タブレット(幅767px以下)■ ::::::::::::*/
			 @media screen and (max-width: 767px) {
                    div.m-list-osu ul li ul.m-list-03 li {width: 28%;}}

        /*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 480px) {				
				    div.m-list-osu ul li ul.m-list-03 li {
                        width: 43%;
                        font-size: 90%;}}

        /*::::::: ■スマホ(幅360px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 360px) {               
                div.m-list-osu ul li ul.m-list-03 li {
					width: 100%;
                    font-size: 80%;}}

		/*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/



/*今月のおすすめ商品*/
/*1個の大きさ 1列*/
        div.m-list-osu ul li ul.m-list-06 li {
            padding: 1% 0.5% 2%;
            width: 98%;}

		/*::::::: ■(幅767px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 767px) {            
				div.m-list-osu ul li ul.m-list-06 li {
                    padding: 1% 2%;
                    width: 45%;}}



/*================================================
 * プリント種類・料金
 ================================================*/
/*カテゴリ囲み*/
div.m-list-pri{
    margin: 0 0.5% 0 0;
    padding-left:0.8%;
    width: 100%;}

		/*::::::: ■(幅767px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 767px) {
                div.m-list-pri{
                    width: 98.5%;}}

/*囲み*/
.printｍ dl {
    float: left;
    margin: 3% 1% 0;
    text-align: center;
    background-color: #fff;
border: #ccc solid 2px;}

/*カテゴリタイトル*/
.printｍ dt {
    float: left;
    clear: left;
    padding: 2% 0 1.5%;
    width: 100%;
    color: #fff;
    font-size: 150%;
    background-color: #ec1c24;
    font-weight: bold;}


/*説明部分　背景　高さ*/
.priset01 {
    height: 65px;
    background-color: #fff;}

		/*::::::: ■(幅760px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 760px) {
				.priset01 {
                    height: 80px;}}


/*説明部分*/
.printｍ p {
    display: inline-block;
    margin: 5% 1.5% 0;
    text-align: left;
    font-size: 1.2em;}

		/*::::::: ■(幅760px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 760px) {
				.printｍ p {
                    margin: 4% 0 0 3%;}}



/*詳しく見る　ボタン*/

       div.prigo{
            margin: 1em auto;
            width:60%;
            -webkit-border-radius:4px;
            border-radius: 4px;
            cursor: pointer;}

                div.prigo p{
                    display: block;
                    padding: 0.5em ;
                    text-align: center;
                    font-size: 1.6em;
                    font-weight: bold;}

		/*::::::: ■(幅600px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 600px) {

                div.prigo{
                    width:90%;}}

/*================================================
 * デザイン・入稿
 ================================================*/
/*全体囲み*/
div.m-design-waku {
    margin: 0 auto;
    padding: 1em 0.5em;
    width: 98.5%;}


/*デザイン　素材　注文書　各囲み枠*/

div.m-list-07{
        position:relative;
        margin: 0.5% auto 1em;
        padding: 0;
        width:;
        font-size: 1.6em;
        background:#fff;
        border: 2px solid #fff;}


/*デザイン　Tシャツ/カバー等　各リスト囲み　横3等分*/

ul.m-list-07-1 li{
        margin: 0.5%;
        padding: 0;
        width:32%;}

		/*::::::: ■(幅680px以下)■ ::::::::::::::::::*/
			@media screen and (max-width: 680px) {            
				ul.m-list-07-1 li{
                    margin: 0;
                    padding: 0;
                    width:98%;}}



/*商品別 リストリンク*/
ul li ul.m-list-08{
    margin: 0;
    padding: 5px 0;
    display: inline-block;}    

/*リスト　縦並び*/
ul li ul.m-list-08 li{
        position:relative;
        margin: 0 0 0 10px;
        padding: 0 0 0 15px;
        width: 100%;
        line-height:2;}


        /*:::::::: ■タブレット(幅850px以下)■ :::::::::::: 2列*/
			 @media screen and (max-width: 850px) {
                    ul li ul.m-list-08 li {
                        width: 90%;}}

        /*:::::::: ■(幅480px以下)■ :::::::::::: */
			 @media screen and (max-width: 480px) {
                    ul li ul.m-list-08 li {
                        font-size: 1.1em;}}

		/*::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


            ul li ul.m-list-08 li a{
                display: block;}

            ul li ul.m-list-080 li:hover{
                background-color: #583822;
                color: #fff;}

            ul li ul.m-list-08 li a:hover{
                display: block;
                font-weight: bold;
                color: red;}

/*子メニュー▲*/
			ul li ul.m-list-08 li:before{
				counter-increment: list;
                content: "";
                display: block;
                position: absolute;
                left: 3px;
                height: 0;
                width: 0;
                border-top: 4px solid transparent;
                border-bottom: 4px solid transparent;
                border-left: 7px solid #FFB319;
                top: 50%;
                -moz-transform: translateY(-50%);
                -webkit-transform: translateY(-50%);
                -o-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                transform: translateY(-50%);}



/*カテゴリ　文字イメージ*/

div.labtai{/*背景*/
    display: block;
    padding: 4px 10px;
    pointer-events: none;
    height: 2.5em;
    color: #fff;
    font-size: 1em;
    font-weight: bold;}

.lab-00-1{background:#8b0000;}/*デザインの作り方*/

            .lab-01{/*作り方*/
                    display: block;
                    width: 15em;
                    height: 2em;}

.lab-00-2{background:#FF99B3;}/*イラスト素材*/

                .lab-02{/*素材*/
                    display: block;
                    width: 19.5em;
                    height: 2.5em;}

.lab-00-3{background:#008b8b;}/*注文書*/

                .lab-03{/*注文書*/
                    display: block;
                    width: 18em;
                    height: 2.5em;}


/*デザインの作り方　小カテ　*/
    .accbox label {
        display: block;
        margin: 0;
        padding: 0.2em 0.7em 0.1em;
        color: #fff;
        font-size: 110%;
        font-weight: bold;}

                .bk01{/* デザイン　サーモン*/
                    background-color: #ff7f50;}

                .bk01-2{/* デザイン　黄緑*/
                    background-color: #7ac843;} 


/*　矢印　アイコンを表示*/
    div.accbox label:before {
        content: '\f054';
        font-family: 'FontAwesome';
        padding-right: 8px;}

/*チェックは隠す*/
    .accbox input {
        display: none;}

/* 個別カテ別説明枠*/
div.deza-se {
    display: block;
    margin: 0.5em auto;
    padding: 0;
    width: 93%;
    background-color: #fff;}
            

/*灰色文字カテ説明*/
    .deza-02{
        margin: 0 auto;
        padding: 0.5em 1em 0;
        color: #aaa;}


/*素材カテゴリ*/
      ul.m-list-10{
            padding: 0%;
            width: 60%;}

       ul.m-list-10 li {
            padding: 0 1%;
            width: 21%;}

       /*:::::::: ■タブレット(幅820px以下)■ :::::::::::: */
			 @media screen and (max-width: 820px) {
                    ul.m-list-10{
                        padding: 0%;
                        width: 100%;
                        border: red solid 0px;}}

      /*:::::::: ■(幅480px以下)■ :::::::::::: */
			 @media screen and (max-width: 480px) {
                 
                    ul.m-list-10 li {
                        margin: 0;
                        width:23%;}}

/*注文用紙*/

       ul.m-list-11 li {
            padding: 1%;
            width: 12%;}

       /*:::::::: ■タブレット(幅820px以下)■ :::::::::::: */
			 @media screen and (max-width: 820px) {
                
                    ul.m-list-11 li {
                        margin: 0 5px;
                        width: 16%;}}

      /*:::::::: ■(幅480px以下)■ :::::::::::: */
			 @media screen and (max-width: 480px) {
                 
                    ul.m-list-11 li {
                        margin: 0;
                        width:31%;}}





/*ＰＣ表示は中身を開いたまま　スマホ表示は閉じておく*/

    /*::::::: ■スマホ(幅480px以下)■ ::::::::::::::::::*/
            @media screen and (max-width: 480px){
/*ポインターを指マークに*/   
                .accbox label {
                    pointer-events: all;
                    cursor: pointer;}
    
/*ラベルホバー時
                .accbox label:hover {
                    background :#4C66CC;}*/
    
/*中身を非表示にしておく*/
                .accbox .accshow {
                    height: 0;
                    padding: 0;
                    overflow: hidden;
                    opacity: 0;
                    transition: 0.2s;}

/*クリックで中身表示*/
                .cssacc:checked + label + .accshow {
                    height: auto;
                    padding: 5px;
                    background: #fff5eb;
                    opacity: 1;}}

/*アイコンを入れ替える*/
                .cssacc:checked + label:before {
                    content: '\f078';}}





/*================================================
 * ボタンカラー
 ================================================*/

/* 青　フォームボタン */
       .blue-bt{
           color: #fff;
            background: #0098e9;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #3dabca), color-stop(0.5, #0098e9));
            background: -moz-linear-gradient(top, #3dabca 50%,#0098e9 50%);
            background: -o-linear-gradient(top, #3dabca 50%,#0098e9 50%);
            background: -ms-linear-gradient(top, #3dabca 50%,#0098e9 50%);
            background: linear-gradient(top, #3dabca 50%, #0098e9 50%);
            filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#3dabca 50%', endColorstr='#0098e9 50%');
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#3dabca 50%', endColorstr='#0098e9 50%')";}

/* green　ＬＩＮＥボタン */
       .green-bt{
           color: #fff;
            background: #22a038;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #00b900), color-stop(0.5, #22a038));
            background: -moz-linear-gradient(top, #00b900 50%,#22a038 50%);
            background: -o-linear-gradient(top, #00b900 50%,#22a038 50%);
            background: -ms-linear-gradient(top, #00b900 50%,#22a038 50%);
            background: linear-gradient(top, #00b900 50%, #22a038 50%);
            filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#00b900 50%', endColorstr='#22a038 50%');
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#00b900 50%', endColorstr='#22a038 50%')";}

/*　ピンク 電話ボタン */
       .pink-bt{
           color: #583822;
            background: #ff7dba;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #ff9fba), color-stop(0.5, #ff7dba));
            background: -moz-linear-gradient(top, #ff9fba 50%,#ff7dba 50%);
            background: -o-linear-gradient(top, #ff9fba 50%,#ff7dba 50%);
            background: -ms-linear-gradient(top, #ff9fba 50%,#ff7dba 50%);
            background: linear-gradient(top, #ff9fba 50%, #ff7dba 50%);
            filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ff9fba 50%', endColorstr='#ff7dba 50%');
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ff9fba 50%', endColorstr='#ff7dba 50%')";}


/*　ブラック */
       .black-bt{
           color: #fff;
            background: #000;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #333), color-stop(0.5, #000));
            background: -moz-linear-gradient(top, #333 50%,#000 50%);
            background: -o-linear-gradient(top, #333 50%,#000 50%);
            background: -ms-linear-gradient(top, #333 50%,#000 50%);
            background: linear-gradient(top, #333 50%, #000 50%);
            filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#333 50%', endColorstr='#000 50%');
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#333 50%', endColorstr='#000 50%')";}

/*　ブラウン */
       .brown-bt{
           color: #fff;
            background: #7f4f21;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #7f4f21), color-stop(0.5, #583822));
            background: -moz-linear-gradient(top, #7f4f21 50%,#583822 50%);
            background: -o-linear-gradient(top, #7f4f21 50%,#583822 50%);
            background: -ms-linear-gradient(top, #7f4f21 50%,#583822 50%);
            background: linear-gradient(top, #7f4f21 50%, #583822 50%);
            filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#7f4f21 50%', endColorstr='#583822 50%');
            -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#7f4f21 50%', endColorstr='#583822 50%')";}






/*================================================
 * アコーディオンメニュー
 ================================================*/
input{
	display: none;}

.title{
	pointer-events: none;}

    @media screen and (max-width: 640px){
	   .title{
		  pointer-events: all;}
	
	   .toggle{
		  height: 0;
		  padding: 0 8px;
		  transition: .2s;}
	
	   input:checked + .toggle{
		  height: auto;
		  padding: 8px;}
	
	   .toggle li{
		  padding: 0 8px;
		  line-height: 0;
		  visibility: hidden;
		  opacity: 0;
		  transition: 
              padding .2s,
              line-height .2s,
              visibility .1s,
              opacity .1s;}
	
	   input:checked + .toggle li{
           padding: 0 0 0 10px;
           visibility: visible;
           opacity: 1;}}