body { margin:0; padding:0; }
header{ background-color: #f39800; background-image:url('images/header_bk9.jpg'); background-position:center bottom 84px; background-repeat: no-repeat; color:#FFF; text-align:center; }
h1 { margin:0; padding:12px 0 0 0; }
h1 img { width:200px; height:auto; }

div#mainImg { width:100%; height:270px; overflow:hidden; }
  div#mainImg img { width:100%; height:auto; }

header h2 { font-size:34px; }
header p { width:614px; margin:24px auto; text-align:left; }

#menu { display:flex; justify-content: center; margin:24px 0 0 0 ; padding:0; }
  #menu li { list-style-type:none; font-size:12px; margin:0; padding:0 0; border-right:2px dotted #f39800; width:106px;  }
  #menu li:first-child  { border-left:2px dotted #f39800; }
  #menu li div { height:2.5em; display:flex; align-items:center; flex-wrap:wrap; justify-content: center; }
  #menu li div span { font-size:.3vw; display:block; width:100%; }
  #menu li img { width:auto; height:32px; }
  #menu li a { display:block; text-decoration:none; border-bottom:6px solid #fff;color:#f39800; padding: 0 8px; }
  #menu li:nth-child(5) a { padding:0; }
  #menu li:nth-child(6) a { padding:0; }
  #menu li a:hover,#menu li a.on { border-bottom:6px solid #f39800; } 

#submenu { width:100%; height:84px; background-color:#FFF; display:flex; justify-content: center; align-items: end;  }
#submenu a { display:inline-block; text-decoration:none; border:1px solid #f39800; color:#f39800; margin:0 12px; padding:6px; width:180px; border-radius:6px; display:flex; justify-content: center; align-items: center;  }
#submenu a span { display:inline-block; margin-right:12px; }
#submenu a:hover { background-color:#f39800; color:#FFF; }
#submenu a img { vertical-align:middle; }
#submenu a:hover img.svg { filter: brightness(0) invert(1); }

section { padding:32px 0; }


/* */
section#about h2 { color:#f39800; font-size:30px; }
section#about { text-align:center; }
section#about p { text-align:left; width:800px; margin:24px auto;  }
section#about h3 { color:#479a37; font-size:24px; }

ul#character    { display:flex; flex-wrap:wrap; justify-content: space-between; width:1000px; margin:0 auto; padding:0;  }
ul#character li { list-style-type:none; background:url("images/tp_char_bk02.png") no-repeat 0 0; width:484px; height:189px; margin:0; padding:72px 0 0 48px; color:#FFF; font-size:20px; font-weight:bold; box-sizing:border-box; }
ul#character li:first-child { background:url("images/tp_char_bk01.png") no-repeat 0 0; }
ul#character li:nth-child(3){ background:url("images/tp_char_bk03.png") no-repeat 0 0; }
ul#character li:nth-child(4){ background:url("images/tp_char_bk04.png") no-repeat 0 0; }
ul#character li:nth-child(5){ background:url("images/tp_char_bk05.png") no-repeat 0 0; }
ul#character li:nth-child(6){ background:url("images/tp_char_bk06.png") no-repeat 0 0; }

ul#character a { color:#FFF; text-decoration:none; display:block; width:484px; height:189px; padding:80px 0 0 100px; box-sizing: border-box; font-size:20px; font-weight:bold; }

/* */
section#office { width:1000px; margin:0 auto; }
section#office h2 { background-color:#f39800; padding:8px; color:#FFF; text-align:center; font-size:24px; border-radius:12px; }
section#office h3 { text-align:center; font-size:32px;  }
section#office p  { text-align:left; }
div.ofc   { text-align:center; }
div.ofc a { border:4px solid #f39800; color:#f39800; padding:4px 14px; margin:24px auto; border-radius:18px; display:inline-block; text-decoration:none; }

/* */
section#helperStation { background-color:#fff9b1; }
section#helperStation dl { width:1000px; margin:0 auto; }
section#helperStation dt { background-color:#f39800; text-align:right; color:#FFF; box-sizing: border-box; padding:8px 32px; font-size:20px; border-top-left-radius:24px; border-top-right-radius:24px; }
section#helperStation dt span { font-size:16px; }
section#helperStation dt div  { font-size:12px; }
section#helperStation dd { background-color:#FFF; box-sizing: border-box; margin:0; padding:32px 32px 32px 434px; position:relative; }
section#helperStation dd img { position:absolute; left:18px; bottom:18px; }
section#helperStation dd { color:#f39800; font-weight:bold; font-size:22px;  }
section#helperStation dd  p { color:#000; font-weight:normal; font-size:16px; }
section#helperStation dd:last-child { padding:32px 32px 32px 32px; font-size:16px; color:#333; text-align:center; }
section#helperStation dd:last-child a { text-decoration:none; color:#333; }
section#helperStation dd:last-child a:hover { color:#f39800; }
section#helperStation dd:last-child span { display:inline-block; margin-right:0.5em; color:#f39800; }
/* */
section#procedure h2 { color:#f39800; font-size:24px; }
section#procedure { text-align:center; }
section#procedure ul { width:1000px; margin:0 auto; display:flex; justify-content: space-between;  }
section#procedure li { list-style-type:none; width:30%; margin:0; padding:0;  }
section#procedure h3 { background-color:#f39800; color:#FFF; border-radius:12px; position:relative; }
section#procedure h3 span { position:absolute; right:-32px; color:#898989; }
section#procedure p  { text-align:left; font-size:14px; }

/* */
section#idxBlog { background-color:#f39800; text-align:center; margin-bottom:48px; }
section#idxBlog ul { width:1000px; margin:0 auto;  display:flex; justify-content: space-between; }
section#idxBlog li { width:23%; list-style-type:none; width:23%; margin:0 0 0 14px; padding:0; }
section#idxBlog li:first-child { margin-left:0; }
section#idxBlog p { color:#FFF; }
.blogThumb { width:100%; height:210px; overflow:hidden; background-color:#000; }
.blogThumb img { width:auto; height:100%; }
.blogCtg   { color:#FFF; }
.blogBk1   { background-color:#6fba2c; }
.blogBk2   { background-color:#00b9ef; }
.blogBk3   { background-color:#ee87b4; }
.blogTitle { font-size:14px; text-align:left; padding:12px 0; }
.blogYmd   { border-top:3px dotted #000; font-size:12px; text-align:left; }

div.more   { text-align:center; }
div.more a { border:4px solid #fff; color:#fff; padding:4px 14px; margin:24px auto; border-radius:18px; display:inline-block; text-decoration:none; }

/* */
section#message { text-align:center; }
section#message h2 { color:#f39800; font-size:24px; }
section#message h3 { ext-align:center; font-size:32px;  }
section#message p { width:1000px; margin:24px auto; font-size:14px; text-align:left; }
#areaMng { font-size:24px; }
#areaMng div { font-size:12px; }

div#company { width:1000px; margin:0 auto; /* display:flex; justify-content: space-between; */box-shadow:10px 10px 15px #AAA; box-sizing: border-box; padding:32px; border-radius:18px; border:1px solid #EEE; background-color:#FFF; }
div#company div img { width:90%; max-width:420px; height:auto; margin-bottom:24px; }
div#company h2 { width:100%; background-color:#f39800; color:#FFF; margin:0; padding:4px; box-sizing:border-box;  border-radius:18px; font-size:24px; }
div#company p#rinen { font-size:24px; text-align:center; width:100%; }
div#company p#rinen strong { color:#f39800; }
div#company dl { width:936px; display:flex;  flex-wrap:wrap; text-align:left; margin:0; padding:8px 0 0 0; }
div#company dt { width:100px; margin:0; padding:0; }
div#company dd { width:836px; margin:0; padding:0; }


div#groupBox h2 { font-size:24px; color:#000; margin-top:48px; }
div#groupBox ul { width:1000px; margin:0 auto; padding:0; display:flex; justify-content: space-between;; flex-wrap:wrap; }
div#groupBox li { list-style-type:none; margin:0 0 24px 0; padding:0; width:32%;  }
div#groupBox ul:after { content: ''; display: block; width: 32%;  height: 0; }
div#groupBox li a { display:block; background-color:#7d7d7d; border-radius:12px; color:#FFF; text-decoration:none; padding:4px 0; }
/* */
section#contact {   }
section#contact h2 { background-color:#f39800; color:#FFF; text-align:center; border-radius:18px; width:1000px; margin:0 auto;  }
#frmBox { display:flex; justify-content: space-between; width:1000px; margin:0 auto;}
section#contact dl { width:48%; }
section#contact dt { margin:0; padding:0;  }
section#contact dt span { color:red; font-weight:bold; }
section#contact dd { margin:0; padding:0 0 12px 0;  }
section#contact dd input[type="text"] { width:100%;  box-sizing: border-box; padding:4px; }
section#contact dd input[type="tel"] { width:100%; box-sizing: border-box; padding:4px; }
section#contact dd input[type="email"] { width:100%; box-sizing: border-box; padding:4px; }
section#contact dd textarea { width:100%; height:12em;  box-sizing: border-box; padding:4px; }
section#contact button { width:200px; background-color:#FFF; border:4px solid #f39800; color:#f39800; padding:4px 14px; margin:0 auto; border-radius:18px; display:block; }
section#contact a { text-decoration:none; }
/* 共通 */
.btnTop { position:fixed; bottom:48px; right:24px; opacity: 0; visibility: hidden; }
.active {  opacity: 1; visibility: visible; }
.txtL { text-align:left; }
.txtC { text-align:center; }

.sp { display:none; }

.madori { max-width:800px; height:auto; }

#sidemenu { position:fixed; top:50%; right:0; }
#sidemenu a { display:block; width:18px; padding:6px; text-decoration: none; margin:0 0 6px 0; }
#sidemenu a:first-child { background-color:#008000; color:#FFF; }
#sidemenu a:last-child { background-color:#1e90ff; color:#FFF; }

#docLink { text-align:center; padding:0 0 24px 0; }
#docLink a { text-decoration:none; color:#333; }
#docLink a:hover { color:#f39800; }
#docLink span { color:#f39800; display:inline-block; margin-right:1em; }
/* */
footer { }
footer ul { display:flex; justify-content: center; }
footer li { list-style-type:none; border-right:1px solid #999; padding:0 12px; }
footer li:first-child { border-left:1px solid #999; }
footer li a { text-decoration:none; color:#000; }

#ftMyself { background-color:#dcdddd; padding:24px; display:flex; justify-content: center; align-items:center;}
#ftMyself img { width:240px; height:auto; }
#ftMyself div { margin:0 14px; }
#ftCopyright { text-align:center; color:#FFF; background-color:#231815; padding:14px; }



/* ***************** */
section#features { background-color:#fff9b1; padding:32px; text-align:center; }
section#features h2 { text-align:center; font-size:32px; }
section#features h3 { color:#479a37; font-size:24px; }
ul#exImg,ul#exImg3 { display:flex; justify-content: space-between; flex-wrap:wrap; width:90%; max-width:1000px; margin:0 auto; padding:0; }
ul#exImg li,ul#exImg3 li { margin:0; padding:0; list-style-type:none; }

ul#ulfeatures { display:flex; justify-content: space-between; flex-wrap:wrap;  width:1000px; margin:0 auto; padding:0; }
ul#ulfeatures li { margin:0 0 24px 0; padding:0; list-style-type:none; background:url("images/si_f_bk.png") no-repeat 0 0; width:318px; height:92px; color:#FFF; font-size:24px; font-weight:bold;  display:flex; justify-content: center; align-items:center; flex-wrap:wrap; }
ul#ulfeatures li div { font-size:12px; width:100%; }

ul#staff { display:flex; justify-content: space-between; flex-wrap:wrap;  width:1000px; margin:0 auto; padding:0; }
ul#staff li { margin:0 0 24px 0; padding:0; list-style-type:none; width:30%; margin:0; padding:0; }
ul#staff li div { font-size:18px; }
ul#staff li div span { display:inline-block; margin-right:1em; font-size:14px; }
ul#staff li p   { font-size:14px; text-align:left; }
.flexBox { display:flex; justify-content: space-between; }



#details { width:1000px; margin:0 auto; }
#details dl { width:48%; }
#details dt { color:#479a37; font-size:20px; font-weight:bold; }
#details dd { margin:0 0 12px 0; padding:0 0 12px 0; border-bottom:3px dotted #9fa0a0; font-size:12px; }

.circle { display:flex; justify-content: center; align-items:center; width:110px; height:110px; border-radius: 50%; background-color:#479a37; color:#FFF; text-align:center; font-size:16px; }
.arrow  { display:flex; justify-content: center; align-items:center; font-size:32px; color:#9fa0a0; }


.circleOrg { display:flex; justify-content: center; align-items:center; width:74px; height:74px; border-radius: 50%; background-color:#f39800; color:#FFF; text-align:center; font-size:12px; }
.fee { color:#f39800; font-size:20px; font-weight:bold; }

#feeHeat,#notes { color:#FFF; border-radius: 14px; text-align:center; font-size:16px; padding:6px 0; }
#feeHeat { background-color:#479a37; margin-top:12px; }
#feeHeat img { width:18px; height:auto; position:relative; left:-12px; top:4px; }

#feeKaigo { padding:14px 0; justify-content: start; align-items:center;  }
#feeKaigo p { padding-left:48px;  }
#notes   { background-color:#f39800; }

#access { font-size:12px; }
#callBox { display:flex; justify-content: left; margin-top:12px; }
#callBox img { margin-right:12px; }
#callBox a { text-decoration:none; font-size:24px; color:#f39800; font-weight:bold; }

/* セルフ豊岡 */
dl#training    { width:100%; background-color:#fff9b1; border-radius: 16px; overflow:hidden; }
dl#training dt { background-color:#f39800; color:#FFF; text-align:center; border:0; }
dl#training dd { border:0; box-sizing:border-box; padding:0 24px; flex-wrap:wrap; }
dl#training dd div { color:#f39800; width:100%; text-align:center; font-size:18px; padding:8px; }
dl#training dd ul    { margin:0; padding:0; width:48%; }
dl#training dd ul li { margin:0; padding:0; list-style-type:none; }

/* 採用情報 */
.recSelf { width:1000px; margin:0 auto; }
.recSelf h2 { background-color:#f39800; padding:8px; color:#FFF; text-align:center; font-size:24px; border-radius:12px; }
.recSelf h3 { text-align:center; font-weight:normal; font-size:12px; }
.recSelf h4 { text-align:center; font-size:30px; margin:14px 0;  }
.recSelf p  { width:800px; margin:0 auto; }
.recSelf ul { display:flex; justify-content: space-between; margin:0; padding:0; }
.recSelf li { list-style-type:none; margin:0; padding:0;  }

.staffMsgBox { background-color:#fff9b1; padding:0 0 32px; text-align:center; }
.staffMsgBox h2 { color:#FFF; margin:0 auto; padding:0; width:322px; height:62px; line-height:62px; font-size:18px; background:url("images/rec_stfmsg_h2_bk.png") no-repeat 0 0; }
.staffMsgBox h3 { color:#f39800; }
.staffMsgBox .flexBox { width:1000px; margin:0 auto; }
.stfMsg { width:480px; }
.stfnm  { display:flex; align-items: flex-end; text-align:left; font-size:12px;  }
.stfnm img { margin-right:14px;  }
.stfnm div div { font-size:24px; }
.stfMsg p { font-size:14px; text-align:left; }

.stfnoImgBox { border-top:4px dotted #f39800; border-bottom:4px dotted #f39800; width:1000px; margin:24px auto; padding:24px 0; }
.stfnm2 { text-align:left; font-size:12px; }
.stfnm2 span { font-size:24px; }
.stfnoImgBox div.clmbox { width:48%; text-align:left; }

.bk2 { background-color:#fff9b1;  }


/* */


/* contact */
#msgbox { margin:24px 0 0 0; }
.mgbox { text-align:center; padding:6px; border:3px solid #9acd32; color:#9acd32; }
.errbox { text-align:center; padding:6px; border:3px solid #FF0000; color:red; }

/* */
.hamburger-menu { display:none; }




@media screen and ( max-width:512px ) {

	.sp { display:block; }
	.spFull { width:100%; height:auto; }
	.spHalf { width:50%; height:auto; }
	header{ background-image:none;  }

	#hImg { width:100%; auto; }
	div#mainImg { height:auto; }

	header h2 { font-size:4.2vw; }
	
	header p { width:90%; font-size:3.2vw; }

	#menu { display:none; }

	section { padding:18px 0; }

	#sidemenu { display:none; }

/* */
	section#about h2 { color:#f39800; font-size:4.2vw; width:90%; margin:0 auto 18px; }
	section#about img { width:100%; height:auto; }
	section#about p { width:90%; margin:18px auto;  }
	section#about h3 { font-size:4.2vw; }


	ul#character    { display:block; width:90%; margin:0 auto; padding:0;  }
	ul#character li { width:100%; height:auto; margin:0; padding:15% 0 15% 15%; color:#FFF; font-size:4.2vw; background-size: 100%; }

	ul#character li:first-child { background-size: 100%; }
	ul#character li:nth-child(3){ background-size: 100%; }
	ul#character li:nth-child(4){ background-size: 100%; }
	ul#character li:nth-child(5){ background-size: 100%; }
	ul#character li:nth-child(6){ background-size: 100%; }

	
/* */
	section#office { width:90%; }

	section#office h2 { font-size:4.2vw; }
	section#office h3 { font-size:3.8vw  }
	section#office p  { font-size:3.2vw; }

/* */
	section#helperStation dl { width:90%; }
	section#helperStation dt { padding:6px 14px ; font-size:3.2vw; }

	section#helperStation dt span { font-size:3.8vw; }
	section#helperStation dt div  { font-size:3.0vw; }

	section#helperStation dd { margin:0; padding:18px 0; text-align:center; font-size:3.4vw;  }
	section#helperStation dd img { position:static; }
	section#helperStation dd  p { font-size:2.8vw; width:90%; margin: 18px auto; text-align:left; }

/* */
	section#procedure h2 { font-size:4.2vw; }
	section#procedure ul { width:90%; margin:0 auto; padding:0; display:block; }
	section#procedure li { width:100%; margin:0; padding:0;  }

	section#procedure h3 span { display:none; }
	section#procedure p  { font-size:3.2vw; }
	section#procedure  img { width:90%; height:auto; }

/* */
	div#company { width:90%; margin:0 auto; display:block; padding:32px; }
	div#company h2  { margin: 0 auto; font-size:4.2vw; }
	div#company dl { width:100%; display:block;  font-size:3.2vw; margin:0; padding:8px 0 0 0; }
	div#company dt { width:100%; margin:0; padding:0; border-bottom:1px solid #999; }
	div#company dd { width:100%; margin:0 0 18px 0; padding:0; font-size:2.8vw; }


	div#groupBox h2 { font-size:4.2vw; width:90%; margin: 24px auto; }
	div#groupBox ul { width:90%; margin:0 auto; display:block; }
	div#groupBox li { list-style-type:none; margin:0 0 24px 0; padding:0; width:100%;  }
	div#groupBox ul:after { content: ''; display: block; width: 100%;  height: 0; }

/* */
	section#contact { width:100%; margin: 0 auto; }
	section#contact h2 { font-size:4.2vw; width:90%; margin: 0 auto; }
	#frmBox { display:block; width:90%; }
	section#contact dl { width:100%; }

/* myself */
ul#staff { display:block;  width:100%; margin:0 auto; padding:0; }
ul#staff li { margin:0; width:100%; }

ul#staff li div { font-size:18px; }
ul#staff li div span { display:inline-block; margin-right:1em; font-size:14px; }
ul#staff li p   { font-size:14px; text-align:left; }


/* 新着*/
	section#idxBlog { width:100%; margin-bottom:48px; }
	section#idxBlog ul { width:90%; margin:14px auto; padding:0; display:block; }
	section#idxBlog li { width:100%; margin:0 0 14px; padding:0; }
	section#idxBlog p  { width:90%; margin:0 auto; }
	.blogThumb { width:100%; height:210px; overflow:hidden; background-color:#FFF; }
	.blogThumb img { width:100%; height:auto; }
/* 共通 */


/* 共通 */
.btnTop { right:4px; }

.circle { width:90px; height:90px; font-size:3.2vw; }
.arrow  { font-size:4.8vw; }

/* */
	footer ul { display:block; margin:0; padding:0; }
	footer li { border:0; border-bottom: 1px solid #999; padding:4px 0; text-align:center; width:100%;  }
	footer li:first-child { border-left:0; border-top: 1px solid #999; }

	#ftMyself { padding:18px; display:block; text-align:center;}
	#ftMyself img { width:240px; height:auto; }
	#ftMyself div { margin:0 14px; }
	#ftCopyright { text-align:center; color:#FFF; background-color:#231815; padding:14px; }

/* */
/* ***************** */
	section#features { padding:18px; }
	section#features h2 { font-size:4.2vw; }
	section#features h3 { font-size:3.2vw; }

	ul#exImg { width:100%; flex-wrap:wrap; margin:0; padding:0;  }
	ul#exImg li { margin:0; padding:0; }
	ul#exImg img { max-width:100%; }
	ul#exImg li:nth-child(n+3){ width:48%; }
	ul#exImg li.spClm3 { width:32%; }

	ul#exImg3 { }
	ul#exImg3 li { text-align:center; margin:0 auto; padding:0; }


	ul#ulfeatures { display:block; width:100%; margin:0 auto; padding:0; }
	ul#ulfeatures li { margin:0 auto 18px ; padding:0; }

/* */
	#details { width:90%; margin:0 auto; }
	#details dl { width:100%; }
	#details dt { font-size:3.8vw; }

	#details dd { margin:0 0 12px 0; padding:0 0 12px 0; border-bottom:3px dotted #9fa0a0; font-size:12px; }
	#details div.flexBox { flex-wrap:wrap; }

	.feeBox { width:calc(100% - 100px); }
	#feeKaigo { justify-content: space-between; }
	#feeKaigo p { width:calc(100% - 100px); padding-left:0; }

	#access { font-size:3.2vw; text-align:center; }
	#access div { width:100%; text-align:center; }

	#callBox { justify-content: center; margin-bottom:18px; }
	#callBox div { width:auto; }
	#gmap { width:100%; margin:0 auto; }
	#gmap iframe { width:100%; }


/* 採用情報 */
	.recSelf { width:90%; overflow:hidden; }

	.recSelf h2 { font-size:4.8vw; }
	.recSelf h3 { font-size:3.0vw; }
	.recSelf h4 { font-size:4.2vw; }
	.recSelf p  { width:100%; margin:0 auto; }
	.recSelf ul { display:block; margin:0; padding:0; }
	.recSelf li img { width:100%; height:auto;  }

	.staffMsgBox h3 { width:90%; margin:14px auto; font-size:4.0vw; }
	.staffMsgBox .flexBox { width:90%; margin:0 auto; display:block; }
	.workimg img { width:100%; height:auto; }
	.stfMsg { width:100%; }
	.stfnm  { display:block; text-align:center; font-size:12px;  }
	.stfnm img { margin-right:0;  }
	.stfMsg p { font-size:3.4vw; }

	.stfnoImgBox { width:90%; margin:24px auto; padding:24px 0; }
	.stfnoImgBox .flexBox { display:block; width:100%; }
	.stfnoImgBox div.clmbox { width:100%; text-align:left; font-size:3.4vw;  }


/* */
	.hamburger-menu { display:block; }
	.menu-btn {
	    position: fixed;
	    top: 10px;
	    right: 10px;
	    display: flex;
	    height: 48px;
	    width: 48px;
	    justify-content: center;
	    align-items: center;
	    z-index: 90;
	    background-color: #CCC;
	}
	.menu-btn span,
	.menu-btn span:before,
	.menu-btn span:after {
	    content: '';
	    display: block;
	    height: 3px;
	    width: 25px;
	    border-radius: 3px;
	    background-color: #ffffff;
	    position: absolute;
	}
	.menu-btn span:before {
	    bottom: 8px;
	}
	.menu-btn span:after {
	    top: 8px;
	}

	#menu-btn-check:checked ~ .menu-btn span {
	    background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
	}
	#menu-btn-check:checked ~ .menu-btn span::before {
	    bottom: 0;
	    transform: rotate(45deg);
	}
	#menu-btn-check:checked ~ .menu-btn span::after {
	    top: 0;
	    transform: rotate(-45deg);
	}
	#menu-btn-check {
	    display: none;
	}
	.menu-content {
	    width: 100%;
	    height: 100%;
	    position: fixed;
	    top: 0;
	    left: 0;
	    z-index: 80;
	    background-color: #3584bb;
	}
	.menu-content ul {
	    padding: 70px 10px 0;
	}
	.menu-content ul li {
	    border-bottom: solid 1px #ffffff;
	    list-style: none;
	}
	.menu-content ul li a {
	    display: block;
	    width: 100%;
	    font-size: 15px;
	    box-sizing: border-box;
	    color:#ffffff;
	    text-decoration: none;
	    padding: 9px 15px 10px 0;
	    position: relative;
	}
	.menu-content ul li a::before {
	    content: "";
	    width: 7px;
	    height: 7px;
	    border-top: solid 2px #ffffff;
	    border-right: solid 2px #ffffff;
	    transform: rotate(45deg);
	    position: absolute;
	    right: 11px;
	    top: 16px;
	}

	.menu-content {
	    width: 100%;
	    height: 100%;
	    position: fixed;
	    top: 0;
	    left: 100%;/*leftの値を変更してメニューを画面外へ*/
	    z-index: 80;
	    background-color: #f39800;
	    transition: all 0.5s;/*アニメーション設定*/
	}

	#menu-btn-check:checked ~ .menu-content {
	    left: 0;/*メニューを画面内へ*/
	}

}