@charset "utf-8";
/* CSS Document */

@font-face {
font-family: helvetica neue;/* ヘルベチカ太めの英文字────h1のみに使用 */
src: url(./fonts/helveticaneue.ttf) format('truetype');
}
@font-face {
font-family: helvetica;
src: url(./fonts/helvetica.ttf) format('truetype');
}

/*pankuzuNaviBox＝PC画面通常
　pankuzuNaviBox_under＝画面が狭くなって右上のナビとぶつかるのを下に下げた＝各WORKSページとキャラクターページ*/

/* CSSリセットby益子より─────────────────────── */
/* 構造要素とブロックレベル要素 */
html, body, div, h1, h2, h3, h4, h5, h6,
p, blockquote, pre, address, ul, ol, li, dl, dt, dd,
table, th, td, form, fieldset {
margin: 0;
padding: 0;
color: #000;
font-family: "Helvetica","メイリオ", Meiryo, Osaka, Arial, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.footer_copyright li {
font-family: "Helvetica","メイリオ", Meiryo, Osaka, Arial, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
/*リンクテキスト*/
a:link, a:visited {
color:#b3b3b3;/*グレー*/
}
a:hover, a:focus, a:active {/* hover */
color:#0099FF;/*水色*/
color:#000;/*黒*/
}

.worksIMG a:link,
.worksIMG a:visited,
.worksTitle a:link,
.worksTitle a:visited {
color:#0099FF;/*水色*/
}

.naviON,
.naviONcharacter,
.naviONcontact,/* ON */
.naviON a:link,
.naviON a:visited,
.naviON a:hover,
.naviON a:focus,
.naviON a:active,
.naviONcharacter a:link,
.naviONcharacter a:visited,
.naviONcharacter a:hover,
.naviONcharacter a:focus,
.naviONcharacter a:active{
color:#000;/*黒*/
}/* ON */
.colorpink a:link,
.colorpink a:visited {
color:#b3b3b3;/*グレー*/
}/*naviのworksとcharacterのピンク色*/

.colorpink a:hover {
color:#000;/*黒*/
}

/* すべてのブラウザで、どのような状況でも縦スクロールバーを表示 */
html {
overflow: scroll;
overflow: -moz-scrollbars-vertical; /* Firefoxの先行実装 */
overflow-x: scroll; /* Firefoxで横スクが表示されない問題を回避 */
}

/* IE 7のhasLayout問題を解決───フォーム拡大ズレの回避 */
*:first-child+html * {
letter-spacing: 0;
	/*
		zoom: 1;は、
		IEの独自拡張であること、
		さらに、レイアウト崩れが発生しうることから、
		letter-spacing: 0;のほうがベター。
	*/
}

/* テーブルセルのボーダーの設定 */
table {
border-collapse: collapse;
border-spacing: 0;
}
/* 画像のリンクボーダーを非表示に */
img {
border: 0;
}
/* CSSリセットby益子より───────────────────ここまで */

@font-face {
font-family: helvetica neue;/* ヘルベチカ太めの英文字────h1のみに使用 */
src: url(../fonts/helveticaneue.ttf) format('truetype');
}
@font-face {
font-family: helvetica;
src: url(../fonts/helvetica.ttf) format('truetype');
}

body { /* ───スマホで勝手に文字拡大をさせない */
-webkit-text-size-adjust: 100%;
}

/* ────────────────以前から使ってたリセットCSS──────style.css─── */
* {
font-size: 100%;
margin: 0;
padding: 0;
list-style: none;
font-style: normal;
text-decoration: none;
}
body {
background: white;
font-size: 15px;
/* line-height: 2em; */
margin: 0;
padding: 0;
text-decoration: none;
height: 100%;
}

/* ────────────────以前から使ってたリセットCSS──────style.css──ここまで */

html {
}
.box3,.box5,.box6,.footer_copyright,works_container, .worksBox,.worksIMG,.newsBOX,.border.border_CharaWorks,.under_newsALLyear,.profile_left_right_box,.goodsBox ,.worksIMG_yoko_animation{
/*.box2,*/
max-width: 960px;
/*margin: 0 auto;*/
/*display:block;*/
margin-left: auto;/*センター位置*/
margin-right: auto;/*センター位置*/
}

.box2,.box3,.box5,.box6,.ul,.worksBox,.worksIMG,.border,.under_newsALLyear,.profile_left_right_box,.goodsBox,.youtube{
/*newsBOX以外*/
/*padding-left: 20px;
padding-right: 20px;iphoneでは10px?*/
padding-left:2%;
padding-right:2%;/*iphoneでは10px?*/
clear:both;
}
.indexIMG{/*sketch.html*/
max-width: 1600px;
padding-left: 20px;
padding-right: 20px;/*iphoneでは10px?*/
clear:both;
margin-left: auto;/*センター位置*/
margin-right: auto;/*センター位置*/
margin-top: 185px;
text-align:center;
}
.indexIMG img {
    vertical-align: bottom;
    max-width: 100%;
    height: auto;
    border: none;
    text-align: center;
}
.boxALL {/*sketch.html*/
max-width: 2000px;
margin-left: auto;/*センター位置*/
margin-right: auto;/*センター位置*/
}


.footer_copyright {
margin-left: auto;
margin-right:auto;
text-align:center;
}
.sketchmenu {
padding-left: 20px;
padding-right: 20px;
}
/*──────────メニュー以下の位置────────────*/
#works_container {/*works.htmlのメニュー以下の内容*/
margin-top:80px;
}
.sketchmenu{/*Personal works/のメニュー以下の内容*/
margin-top:80px;
}
.box3 {/*news、contact、profileページののメニュー以下の内容*/
margin-top:120px;
}
.box2 {/*characterページののメニュー以下の内容*/
margin-top:120px;
}
.box5 {/*サイトマップページののメニュー以下の内容*/
margin-top:60px;
}
.boxALL {/*sketchページのメニュー以下の内容*/
margin-top:120px;
}

/*──────────メニュー以下の位置────────────*/

.box1{
clear:both;
}
.border { /*───Newsページ───*/
    padding-top: 50px;
    margin-bottom: 50px;
    background: url(../img/line_dot_g.gif) repeat-x left bottom;
    height: 2px;
    clear: both;
}
.border_CharaWorks,/*───キャラクターページのWorks紹介───*/
.border_Works { /*───Works紹介───*/
    margin-bottom: 50px;
    background: url(../img/line_dot_g.gif) repeat-x left bottom;
    height: 2px;
    clear: both;
	text-align: center;
    color: gray;
    font-size: 20px;
	line-height:4em;
}

.yajirushi {
margin-right: 2px;
vertical-align:text-top;
margin-top:7px;
}
.nihongo_hosoku {
font-size: 12px;
font-weight: normal;
color: #999;
}

.box1 { /* ──────────────固定のナビゲーション── */
margin-bottom:0px;
position: fixed;
top: 0;
left:0;
z-index:10;
height:100px;
 }
.box2 {
font-family: 'Fredoka One', cursive;
}

.box4 {
padding-top:20px;
}
.box5 {
padding-top:40px;
}
.sketch { /* ───<body>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-55QZ4MX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->タグsketchページ背景画像設定─── */
background: url(../css/img/haikei.gif) repeat;
}
.pankuzuNaviBox,
.pankuzuNaviBox_under {/* ─────────パンくずナビ */
/*margin-top: 106px;*/
position: fixed;
padding-left: 30px;
top: 40px;
z-index:40;
}
.pankuzuNavi { 
clear:both;
}
.pankuzuNavi li {
float: left;
font-size: 13px;
font-size: 11px;
line-height:3em;
font-weight:400;
}
.pankuzuNavi li,
.pankuzuNavi li a {
margin-right: 8px;
color:#000;/*黒*/
}
.pankuzuNavi li a:hover {
text-decoration:underline;
}
.pankuzuNavi li strong {
color: #000;
}
.pankuzuNavi:after {
clear:both;
}

/* クロコダイルマン横長画像 
.imgCroco1 {
clear:both;
display:block;
overflow-y: hidden;
margin-top:29%;
}
*/

/* ──────────768px以下 */
/*@media (max-width: 768px){
.box6,.box7 {
max-width: 960px;
margin: 0 auto;
padding-left: 20px;
padding-right: 20px;
}*/
/* クロコダイルマン横長画像 
.imgCroco1 {
clear:both;
display:block;
overflow-y: hidden;
margin-top:28%;
}*/
/*.pankuzuNaviBox {
margin-top:10%;上の余白
padding-bottom: 10%;
}*/
/*.pankuzuNavi { 
display: block;
clear:both;
}*/

}
/* ########### 430px 以下 ########### */
@media (max-width: 430px) {
.box2,.box3,.box4,.box5,.footer_copyright ul,.pankuzuNaviBox,.worksBox,.worksIMG,.border,.under_newsALLyear,.profile_left_right_box {
/*padding-left: 10px;
padding-right: 10px;/*430以上は15px*/
}

.footer_copyright ul #copyright {
font-size: 8px;
}
}

/* ──────class───全ページ───共通設定──── */
.hihyouji {/* 非表示文字読み上げ用 */
	width: 0;
	height: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
	text-indent: -9999px;
	/* display: none;はダメ */
	/* visibility: hidden;もダメ */
}
.titleH3 {
/* clear: both; */
font-family: helvetica neue, sans-serif;/* ヘルベチカ太めの英文字 */
font-size: 20px;
font-weight:normal;
color:#999;
line-height: 1.5em;
margin-bottom: 300px;
height:50px;
width:50px;
background-color:#960;
}


/* ──────────全ページ共通 */
.box1,
.box1 p {
width: 100%;
}
.box1 p {
text-align:center;
margin-left:auto;
margin-right:auto;
}
.nav,
.nav_top {
margin-left:auto;
margin-right:auto;
}
/*.box1 p img {
vertical-align:bottom;
max-width: 700px;
width:70%;
height: auto;
border: none;
text-align:center;
margin-left:auto;
margin-right:auto;
margin-top:70px;
}*/
.box1 h1 {
font-size:12px;
text-align:center;
padding-top:7px;
padding-bottom:3px;
height:25px;
font-weight: normal;
position: fixed;
top: 0;
padding-left: 30px;
padding-right: 30px;/*iphoneでは10px?*/
z-index:1;
border-bottom:1px solid #CCC;
background-color:#FFF;
width:100%;
text-align:left;/*これを消すとセンター位置になる*/
color:#999;
}
.h1_blue {
color: #000;
font-family:helvetica neue, Arial, sans-serif;
}
.box1 p {/*index.html SEIJIRO KUBO*/
font-size:65px;
font-size:58px;
text-align:center;
margin-top:50px;
font-family:helvetica neue, Arial, sans-serif;
}
.box2 {
text-align:center;
margin-left:auto;
margin-right:auto;
}
.sketchIMG img {/*index.html*/
vertical-align:bottom;
/*margin-bottom:100px; sketch下の余白 */
max-width: 100%;
height: auto;
border: none;
text-align:center;
}
.link_crocodileman img,
.link_crocodileman2 img {
vertical-align:bottom;
margin-top:5%; /* sketch上の余白 */
/*margin-bottom:100px; sketch下の余白 */
max-width: 100%;
height: auto;
border: none;
text-align:center;
}
.link_crocodileman2 img {margin-top:3%;}

.sketchIMGtext {
margin-top:1.5em;
color: #999;
font-size: 14px;
font-weight: normal;
text-align:center;
}
.btn_sns {
	text-align:center;
	margin-top:2em;
	margin-bottom:2em;
}
.box2 .btnGoods img {
max-width: 50%;
height: auto;
margin-top:2em;
float:left;
}

.h_title {
	color: #0099ff;
    font-family: Fredoka One;
    font-size: 24px;
	/* margin: 0 20px; */
}
.h_title_pink {
	color: #0099FF;
    font-size: 20px;
	padding-left: 50px;
	/* margin: 0 20px; */
}
.line_dot {
margin-top: 5px;
margin-bottom:30px;
background: rgba(0, 0, 0, 0) url("../img/line_dot_dark.gif") repeat-x scroll left bottom;
height: 2px;
}
.line_dot_chara {
margin-top: 5px;
margin-bottom:20px;
background: rgba(0, 0, 0, 0) url("../img/line_dot_dark.gif") repeat-x scroll left bottom;
height: 2px;
clear:both;
padding-top:5%;
}
.h_hosoku {
    color: #999;
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,Arial,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    font-size: 14px;
    font-weight: normal;
    line-height:0em;
}
.h_hosoku_sketch {
    color: #999;
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,Arial,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    font-size: 14px;
    font-weight: normal;
    line-height:0em;
	text-align:right;
}

.works1 {
float: left;
width:18.5%;
margin-bottom:15px;
text-align:center;
font-weight: 700;
font-size:13px;
padding:0.7%;
}
.works1 img {
vertical-align:bottom;
max-width: 100%;
height: auto;
border:none;
margin-bottom:0.5vw;
display:block;
}
.works1 a:hover img {
  opacity: 0.4;
  filter: alpha(opacity=40);
  -ms-filter: "alpha(opacity=40)";
}
/* ──topページ─オリジナルキャラクター─一番下のキャラクター一覧─ */
.box4 {
max-width:1800px;
margin-left: auto;
margin-right: auto;
}
.box4 ul {
padding-left:50px;
padding-right:30px;
}
.box4 li {
float: left;
width:16.65%;/*一番下のキャラクター画像サイズ*/
height: auto;
border: none;
text-align:center;
/* background:#CCC;*/
}
.box5 {clear:both;}
.box4 ul li img {
vertical-align:bottom;
max-width: 100%;
height: auto;
border: none;
clear:both;
margin-bottom:8px;
}
.box4 ul li a	{
display: block;
padding: 20px 20px 5px 0px;
color: #000000;
    font-size: 11px;
    color: #999;
}
.box4 ul li a img {
display: block;
}
.box4 ul li a:after	{
content: "";
display: block;
clear: both;
}
.box4 ul li a:hover img {
  opacity: 0.4;
  filter: alpha(opacity=40);
  -ms-filter: "alpha(opacity=40)";
}
.charatext_hosoku {
font-size:13px;
display: block;
font-weight:normal;
color: #999;
}

.works_linkword {
text-align:right;
clear:both;
padding-top:1em;
color: grray;
margin-right:20px;
font-size:small;
padding-top:30px;
}
.works_linkword a {
color:gray;
border: solid 1px;
padding: 0.3em 0.5em;
}


.chara_salesword {
text-align:center;
clear:both;
padding-top:30px;
    color: #999;
	    font-size: 14px;
		max-width:715px;
		margin-left:auto;
		margin-right:auto;
}

#topshiryoseikyu {
    color: #0099FF;
    border: 1px solid ;
margin-top:30px;
    max-width:900px;
	height: auto;
}
.shiryoseikyu_moji {
margin:2% 2% 2% 0.5%;
	font-size:16px;
}
.profile_img01 {
	text-align:center;
	margin-bottom:1.5%;
	vertical-align:bottom;
}
.profile_img01 img {
height: auto;
width: 100%;
}
/* ──────全ページ共通──footer────コピーライト──── */
.footer_copyright {
clear:both;
max-width:530px;
text-align:center;
padding-top:50px;
}
.footer_copyright ul {
paddin50px;
padding-bottom:70px;
text-align:center;
}
.footer_copyright ul li {
display: inline;
font-size: 11px;
color:#999;
margin-right:20px;
vertical-align: bottom;
text-align:center;
}
.footer_copyright ul li#copyright {font-size: 13px;}
.footer_copyright ul li#sitemap{margin-right:0px;}
.footer_copyright ul li a:link {
color:#999;
}
.footer_copyright ul li a:visited {
color:#999;
}
.footer_copyright ul li a:hover,
.footer_copyright ul li a:focus,
.footer_copyright ul li a:active {
color:#999;
text-decoration: underline;
}
.footer_copyright ul li img {
margin-right: 2px;
}
/*  ───更新情報─── */
.box5 {
clear:both;
line-height:2em;
}
.box5 p {
border-bottom-color: #898989;
border-bottom-style: dotted;
border-bottom-width: 1px;
line-height: 1.6em;
margin-bottom: 6px;
padding-bottom: 5px;
}
.box5 p img {
margin-right: 3px;
margin-left: 3px;
}
.box5 h4 {
font-size: 16px;
color:#0099FF;/* 文字の水色 */
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, Arial, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
height: 22px;/* 高さ調整のため */
margin-bottom:10px;
}

/* ──────768pxのところを変更してみた─────────768px以上 */
@media (min-width: 768px){
.h1_blue {
margin-right:10px; font-size:18px; vertical-align:-1px;}
.nav_top {
width: 100%;
}
.nav {
margin-top:50px;
}
.nav ul {
text-align: right;
margin-right:30px;
}
.nav_top {
margin-top: 15px;
}
/*.nav ul {
margin-top:40px;
}*/
.nav ul li {
margin-top:20px;
}
.nav ul li#works,
.nav ul li#sketch,
.nav ul li#news,
.nav ul li#profile,
.nav ul li#contact,
.nav ul li#characters,
.nav_top ul li#works,
.nav_top ul li#sketch,
.nav
.top ul li#news,
.nav_top ul li#works,
.nav_top ul li#sketch,
.nav_top ul li#news,
.nav_top ul li#profile,
.nav_top ul li#contact,
.nav_top ul li#characters,
.naviON,
.naviONcharacter,
.naviONcontact,
.nav_under ul li#works,
.nav_under ul li#sketch,
.nav_under ul li#news,
.nav_under ul li#profile,
.nav_under ul li#contact,
.nav_under ul li#characters {
display: inline-block;
display:inline;
zoom: 1;
font-size: 15px;

/*font-family: helvetica, sans-serif; ヘルベチカ細めの英文字 */
/*font-family: helvetica neue, sans-serif; ヘルベチカ太めの英文字 */
font-family: helvetica neue, sans-serif;
font-weight: bold;
vertical-align:baseline;
margin:15px 13px;
color:#000;
}
.nav ul li#characters,
.nav ul li.naviONcharacter {
margin-right: 0;
}
.nav_under {
	margin-top:30px;
}
.top_btn {
font-size: 15px;
color: #fff;
    display: inline-block;
    padding: 8px 20px;


border-radius: 100px;
    box-sizing: border-box;
    background: #999;
    text-decoration: none;
    text-align: center;
    margin: 10px 0;

}
.top_btn a:link, .top_btn a:visited {
    color: #333;
	font-family:Arial, Helvetica, sans-serif;
	font-weight: bold;}


.spLogo {display: none;}
/* トグルボタン */
#menubtn {display: none;}
/* ナビゲーションメニュー横並び */	
#menu {display: block !important}
}
/* ───────────960px以下 */
@media (max-width: 960px){
#topshiryoseikyu {
margin-left:20px;
margin-right:20px;
}
.charatext_hosoku {
font-size:12px;
}
.pankuzuNaviBox_under{/* ─パンくずナビがメニューにぶつかるのを回避─sketchぺーじのみメニューも下に下げて回避─────── */
margin-top: 30px;
}
}
@media (ma;x-width: 890px){
.charatext_hosoku {
font-size:11px;
}
}
@media (max-width: 810px){
.charatext_hosoku {
font-size:10px;
}
.pankuzuNaviBox {/* ─パンくずナビがメニューにぶつかるのを回避─sketchぺーじのみメニューも下に下げて回避─────── */
margin-top: 35px;
}
.nav ul {
	text-align:center;}
.sketchmenu {
margin-top: 120px;
}
}
/* ──────────────────────768px以下 */
@media (max-width: 767px){
.box1 h1 {
text-align:left;
font-size:11px;
color:#999;
color:#666;
padding:9px 10px 20px 10px;
}
.box1 p {/*index.html SEIJIRO KUBO*/
font-size:70px;
font-size:63px;
font-size:58px;
margin:60px 0 0;
}

.h1_blue {/*SEIJIRO KUBO*/
font-size:16px;
}
.h1br{
display: block; font-size:12px;line-height:1.8em;}
.box1 h1 img {
margin-top:15px;
margin-left:15px;
}
.box1 h1,/* トグルボタンになった時のindex.html色変更 */	
span.h1br {}
/* トグルボタン */	
#menubtn {
	padding:6px 12px;
/*border: solid 1px #aaaaaa;
border: 1px solid #ccc;*/
	background-color: #ffffff;
	position:absolute;
	top:14px;
	right: 10px;
	cursor:pointer;
border:none;
width: 36px;
height: 27px;
overflow: hidden;
display: block;
z-index:30;
}
.box1 .nav#menu {
	margin-top:0px;
}

#menubtn span,
#menubtn:before,
#menubtn:after {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left:0;
  right: 0;
  width: 30px;
  height: 2px;
  margin: auto;
  background: #000;/*トグルボタン三本線*/
}
#menubtn span {
  overflow: hidden;
  z-index: 1;
  color: #000;
}
#menubtn:before {
  z-index: 2;
  transform: translate(0, -12px);
  content: "";
}
#menubtn:after {
  z-index: 2;
  transform: translate(0, 12px);
  content: "";
}
#menubtn span {
  opacity: 1;
  transition: opacity 150ms 50ms;
}
#menubtn:before,
#menubtn:after {
  transition: transform 200ms;
}

#menubtn.active span {
  opacity: 0;
  transition: opacity 150ms;
}
#menubtn.active::before {
  transform: rotate(45deg);
}
#menubtn.active::after {
  transform: rotate(-45deg);
}
#menubtn:focus {
outline:none;
}
#menubtn i {
  position: absolute;
  left: 0;
  /*height: 4px;
  width: 24px;*/
  background-color: #444;
  display: inline-block;
  box-sizing: border-box;

}
#menubtn span {
display: inline-block;
text-indent: -9999px;
}
.nav_under {
	margin-top:20px;
}
.nav ul li,
.nav_top ul li {
font-size: 22px;
vertical-align:baseline;
padding:15px;
line-height:1.3em;
background-color:#fff;
}
.nav ul li.spLogo {/*トグルの中のSEIJIRO KUBO*/
font-size: 50px;
}
.nav ul,
.nav_top ul {
/*padding-top: 30px;
padding-bottom: 30px;*/
background-color:#fff;
    width: 100%;
    height:700px;
	padding-top:30px;
   /* display: flex;
    justify-content: center;*/
    flex-direction: column;
}
.nav ul{
	padding-top:120px;
}
.spLogo a {
font-size: 40px;
}
.nav_under ul li#works,
.nav_under ul li#sketch,
.nav_under ul li#news,
.nav_under ul li#profile,
.nav_under ul li#contact,
.nav_under ul li#characters {
    display: inline;
    zoom: 1;
    font-size: 15px;
    font-family: helvetica, sans-serif;
    /* font-weight: 500; */
    vertical-align: baseline;
    margin: 15px 13px;
    line-height:2em;
    color: #000;
	margin-top:2em;
}
/* ナビゲーションメニュー縦並び */	
#menu {
display: none;
text-align:center;/*  トグルの時メニューはセンター表示*/
padding: 0;
line-height:10em;
}
.spLogo {
    display: block;
    line-height: 0;
    margin-top: -5vh;
    margin-bottom: 2vh;
}
.indexIMG {
margin-top: 136px;
}
.link_crocodileman img,
.link_crocodileman2 img {
max-width: 100%;
height: auto;
/* margin-top:10%;  sketch上の余白 */
/* margin-bottom:8vw;  sketch下の余白 */
}
.pankuzuNaviBox {/* ─パンくずナビ───トグルBTNになった時──── */
margin-top: 15px;
}
.pankuzuNaviBox,
.pankuzuNaviBox_under {
    padding-left: 10px;
}
.pankuzuNaviBox_under{/* ─パンくずナビがメニューにぶつかるのを回避─sketchぺーじのみメニューも下に下げて回避─────── */
margin-top: 15px;
}
.works1 {
font-size:13px;
margin-bottom:3.4vw;
width:23.5%;
}
.box4 li {
float: left;
width:50%;
max-width: 100%;
height: auto;
border: none;
}
.shiryoseikyu_moji {
margin:2% 0.3% 2% 0.3%;
font-size:15px;
}
.charatext_hosoku{
font-size:12px;
}


.box6 {padding-top: 130px;}/*─???未確認───────*/

/*──────────メニュー以下の位置────────────*/
#works_container {/*works.htmlのメニュー以下の内容*/
margin-top:80px;
}
.sketchmenu{/*Personal works/のメニュー以下の内容*/
margin-top:80px;
}
.box3 {/*news、contact、profileページののメニュー以下の内容*/
margin-top:100px;
}
.box2 {/*characterページののメニュー以下の内容*/
/*margin-top:100px;*/
}
.box5 {/*サイトマップページののメニュー以下の内容*/
margin-top:60px;
}
.boxALL {
margin-top:100px;/*sketchページののメニュー以下の内容*/
}
/*──────────メニュー以下の位置────────────*/

.box4 li a	{ /*下のキャラクターキャラクターの一覧画像のテキスト*/
    font-size: 13px;
}

/* ───────────────────────600px以下 */
@media (max-width: 599px){
.box1 {
height: auto;
 }
.box1 p {/*index.html SEIJIRO KUBO*/
font-size:40px;
margin:60px 0 0;
}
.box2 {
/* text-align:center; */
margin-left:auto;
margin-right:auto;
}
.indexIMG {/*index.html*/
margin-top: 115px;
}
.box3 {
max-width: 100%;
}
.box 3ul:after {clear:both;}
.works1 ul {
width: 100%;
height:100%;
display:block;
clear:both;
}
.works1 ul:after {
content:"";
display:block;
clear:both;
}
.works1 {
font-size:12px;
}
.box2 .btnGoods img {
max-width: 100%;
text-align:center;
margin-left:auto;
margin-right:auto;
float:none;
}
.charatext_hosoku{
font-size:10px;
}

}
@media (max-width: 560px){/* ########### 560px 以下 ########### */
.box4 li a {
    font-size: 13px;
}
.chara_salesword {font-size:11px;}


}
@media (max-width: 480px){/* ########### 480px 以下 ########### */
.works1 {
width: 49%;
font-size:14px;
padding:0.5%;
}
.works1 img {
margin-bottom:2vw;
}
}
@media (max-width: 460px){/* ########### 460px 以下 ########### */
.box4 li {
width:100%;
padding-bottom:20px;
}
.charatext_hosoku{
font-size:12px;
}
}
@media (max-width: 430px) {/* ########### 430px 以下 ########### */
.sketchIMG img {
 /*margin-top:40%; sketch上の余白 */
/* margin-bottom:8vw; sketch下の余白 */
}
/*.works1 {
width: 50%;
}*/
.h_title {
font-size: 24px;
font-weight: 400;
/* margin: 0 10px; */
padding-bottom:0px;/* ドットの高さ調節 */
display:block;
}
.h_hosoku {
display:block;
font-size: 12px;
line-height:1.5em;
}
.shiryoseikyu_moji {
margin:2% 0% 2% 0%;
font-size:13.4px;
}
.box4 li a {
font-size: 15px;
}
.box5 p {
font-size:13px;
}
.chara_salesword {display: none;}

.box3{
padding-left: 20px;
padding-right: 15px;
}
@media (max-width: 400px){/* ########### 400px 以下 ########### */
.box4 li a	{
padding: 5px;
}
.charatext {
font-size:16px;
}
}
@media (max-width: 380px){/* ###########380px 以下 ########### */
.h1_blue {
    font-size: 13px;
}
.box1 h1 {
font-size:10.8px;
}
}