@charset "UTF-8";

html {
  font-size:62.5%;
}
body {
  font-size:1.4rem;
  font-family: 'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
  margin:0px;
  padding:0px;
  text-align:center;
  background-color: #f0f0f0;
}
*, *::before, *::after {
  box-sizing:border-box;
}
.clearfix::after {
  content:'';
  display:block;
  clear:both;
}

a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=60);
}

a:link { color: #000; text-decoration: underline; }
a:visited { color: #000; text-decoration: underline; }
a:hover { color: #333; text-decoration: none; }


/* 基本設定*/

#wrap{
  width: 100%;
  margin: auto;
}



/* PC用CSSの指定（768px以上のPC用）*/

#headbox{
  display: inline-block;
  width: 1200px;
  background-color: #fff;
  text-align: left;
}

#leftbox{
  display: inline-block;
  background-color:#fff;
  width: 860px;
  text-align: center;
  vertical-align: top;
  margin: 20px 0 0 0;
  padding: 20px 20px 0 20px;
}

#rightbox{
  display: inline-block;
  width: 300px;
  text-align: center;
  vertical-align: top;
  margin: 30px 0 0 0;
  padding: 35px 0 0 0;
}



#footbox{
  width: 100%;
  text-align: left;
}


#userbox{
  display: block;
  width: 300px;
  background-color: #fff;
  border-radius:7px;
  text-align: center;
  vertical-align: middle;
  padding: 5px 15px 5px 15px;
}

.company {
  display: block;
  padding: 15px 0 0 0;
  font-size: 1.4rem;
  line-height: 1.8rem;
  font-weight: 800;
}

.usrname{
 display: block;
  padding: 5px 0 5px 0;
  font-size: 2.0rem;
  font-weight: 800;
}

.logaout {
  display: block;
  padding: 10px 0 15px 0;
  font-size: 1.2rem;
}



.smallbtm{
  display: inline-block;
  background-color: #000;
  text-align: center;
  width: 160px;
  border-radius:15px;
  height: 24px;
  padding: 3px 20px 3px 20px;
  margin: 15px 0 15px 0;
  font-size: 12px;
  color: #FFF;
}

#newlistbox{
  display: block;
  width: 300px;
  background-color: #fff;
  border-radius:7px;
  text-align: center;
  vertical-align: middle;
  padding: 5px 5px 5px 5px;
}

.textlines{
border: 1px solid #ccc;
width: 100%; 
height: 120px;
}




.footbar{
  width: 100%;
  margin: 30px 0 15px 0;
  padding: 20px;
  background-color: #000;
}

.footbar2{
  width: 100%;
  margin: 30px 0 0 0;
  padding: 5px;
  background-color: #000;
}

.submit_btm{
  margin: 30px 0 0 0;
  width: 300px;
  border: 0;
}

.loginbtm{
  margin: 30px 30px 5px 30px;
}



.newlistboxcategory {
  display: inline-block;
  width: 230px;
  margin: 0;
  padding: 5px 0 0 0;
  font-size: 1.4rem;
  line-height: 1.8rem;
  font-weight: 800;
  color: #666;
  text-align: left;
}

.newlistboxmark {
  display: inline-block;
  width: 40px;
  margin: 0;
  background-color: #e2670f;
  padding: 2px 5px 2px 5px;
  color: #fff;
  font-size: 1.2rem;
  line-height: 1.8rem;
  font-weight: 800;
  text-align: left;
}

.newlistboxdate {
  display: inline-block;
  width: 275px;
  padding: 5px 0 0 0;
  font-size: 1.0rem;
  font-weight: 800;
  text-align: right;
}

.newlistboxtit {
  display: inline-block;
  width: 275px;
  padding: 5px 0 10px 0;
  font-size: 1.2rem;
  line-height: 2.0rem;
  text-align: left;
}

.newlisttit {
  width: 300px;
  text-align: left;
  padding: 15px 0 15px 0;
  font-size: 1.6rem;
  font-weight: 800;
}

.leftwrap {
  display: block;
  width: 100%;
  margin: 0 auto;
}

.pc-banner{
  display: block;
}
.sp-banner{
  display: none;
}





.topbanr {
  display: flex;
  justify-content:center;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
}
.topbanr img {
  margin: 5px ;
  padding: 0;
}

.topbanr2 {
  display: flex;
  justify-content:center;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
}
.topbanr2 img {
  margin: 5px ;
  padding: 0;
}


.topmainhead {
  width: 760px;
  font-size: 2.4rem;
  font-weight: 800;
  margin: 0 auto;
  padding: 30px 0 10px 0 ;
  border-bottom: 1px solid #000;
}

.topmainline {
  display: block;
  width: 760px;
  
  margin: 0px 20px 10px 20px;
  padding: 0 10px 5px 10px;
}

.topmainbox {
  width: 760px;
  margin: 0 auto;
  padding: 15px 0 0 0;
}

.topmainmusticon {
  display: inline-block;
  width: 600px;
  height: 24px;
  text-align: left;
}

.topmaindoicon {
  display: inline-block;
  width: 150px;
  height: 24px;
  text-align: right;
}

.topmaincategory {
  display: inline-block;
  width: 600px;
  text-align: left;
  font-size: 1.4rem;
  font-weight: 800;
  color: #666;
}

.topmaindate {
  display: inline-block;
  width: 150px;
  text-align: right;
  font-size: 1.2rem;
}

.topmaintit {
  display: block;
  width: 760px;
  text-align: left;
  font-size: 1.4rem;
  line-height: 2.2rem;
  margin: 10px 0 20px 0px;
  padding: 0 0 20px 0;
  border-bottom: 1px solid #000;
}

#centerbox {
  display: inline-block;
  width: 40px;
  background-color: aquamarine;
  margin: 30px 0 0 0;
  padding: 0;
}

#panmenu {
  display: block;
  width: 1200px;
  text-align: left;
  margin: 0 auto;
  padding: 10px 0 0 0;
  font-size: 1.2rem;
}

.footmenu {
  width: 100%;
  text-align: center;
  font-size: 1.4rem;
  line-height: 2.2rem;
}

.footcopy {
  width: 100%;
  text-align: center;
  font-size: 1.2rem;
  margin: 20px 0 20px 0;
}

.footlogo {
  width: 100%;
  text-align: center;
  margin: 10px 0 10px 0;
}




.copytxt{
  font-size: 1.1rem;
}





/* タブレット用CSSの指定（1160px以下のスマホ用）*/
@media screen and (max-width: 1160px) {
  
  #wrap{
  width: 100%;
  margin: auto;
}
  
#leftbox{
  display: inline-block;
  background-color:#fff;
  width: 70%;
  text-align: center;
  vertical-align: top;
  margin: 20px 0 0 0;
  padding: 20px 20px 0 20px;
}


  
  
.leftwrap {
  display: block;
  width: 100%;
  margin: 0 auto;
}

.kvimg img{
  width: 100%;
}


  
  

.topmainhead {
  width: 100%;
  font-size: 2.4rem;
  font-weight: 800;
  margin: 0 auto;
  padding: 30px 0 10px 0 ;
  border-bottom: 1px solid #000;
}

.topmainline {
  display: block;
  width: 100%;
  
  margin: 0px 20px 10px 20px;
  padding: 0 10px 5px 10px;
}

.topmainbox {
  width: 100%;
  margin: 0 auto;
  padding: 15px 0 0 0;
}

.topmainmusticon {
  display: inline-block;
  width: 65%;
  height: 24px;
  text-align: left;
}

.topmaindoicon {
  display: inline-block;
  width: 30%;
  height: 24px;
  text-align: right;
}

.topmaincategory {
  display: inline-block;
  width: 65%;
  text-align: left;
  font-size: 1.4rem;
  font-weight: 800;
  color: #666;
}

.topmaindate {
  display: inline-block;
  width: 30%;
  text-align: right;
  font-size: 1.2rem;
}

.topmaintit {
  display: block;
  width: 100%;
  text-align: left;
  font-size: 1.4rem;
  line-height: 2.2rem;
  margin: 10px 0 20px 0px;
  padding: 0 10px 20px 15px;
  border-bottom: 1px solid #000;
}
  



}




/* SP用CSSの指定（767px以下のスマホ用）*/
@media screen and (max-width: 767px) {
  
#wrap{
  width: 100%;
  margin: auto;
}

  
.pc-banner{
  display: none;
}
.sp-banner{
  display: block;
}
  
.topbanr {
  width: 100%;
  display: inline-block;
  padding: 0;
  margin: 0;
}

.topbanr img {
  width: 48%;
  height: auto;
  margin: 0 ;
  padding: 0;
}
  
 
.topbanr2 img {
  width: 70%;
  height: auto;
  margin: 5px ;
  padding: 0;
}
  
#rightbox{
  display: inline-block;
  width: 100%;
  text-align: center;
  vertical-align: top;
  margin: 30px 0 0 0;
  padding: 35px 0 0 0;
}
  
#newlistbox{
  display: block;
  width: 100%;
  background-color: #fff;
  border-radius:7px;
  text-align: center;
  vertical-align: middle;
  padding: 15px;
}
  

.newlistboxcategory {
  display: inline-block;
  width: 83%;
  margin: 0;
  padding: 5px 0 0 0;
  font-size: 1.8rem;
  line-height: 1.8rem;
  font-weight: 800;
  color: #666;
  text-align: left;
}

.newlistboxmark {
  display: inline-block;
  width: 10%;
  margin: 0 10px 0 0;
  background-color: #e2670f;
  padding: 4px 0 2px 0;
  color: #fff;
  font-size: 1.4rem;
  font-weight: 800;
  text-align: center;
}

.newlistboxdate {
  display: inline-block;
  width: 90%;
  padding: 5px 0 10px 0;
  font-size: 1.4rem;
  font-weight: 800;
  text-align: right;
}

.newlistboxtit {
  display: inline-block;
  width: 95%;
  padding: 5px 0 10px 0;
  font-size: 1.8rem;
  line-height: 2.4rem;
  text-align: left;
}
  
.newlisttit {
  width: 100%;
  text-align: left;
  padding: 15px 10px 15px 15px;
  font-size: 1.8rem;
  font-weight: 800;
}
  
  
  
  
  
.footmenu {
  width: 100%;
  text-align: center;
  font-size: 1.2rem;
  line-height: 2.0rem;
}

.copytxt{
  font-size: 0.8rem;
}

  
}


#userspbox {
  display: block;
  width: 300px;
  background-color: #fff;
  border-radius:7px;
  text-align: center;
  vertical-align: middle;
  padding: 5px 15px 5px 15px;
}

.spmenuline {
  width: 100%;
  margin: 5px 0 5px 0;
  padding: 5px 0 5px 0 ;
  border-bottom: 1px solid #000;
}

.spsmallbtm {
  display: inline-block;
  background-color: #000;
  text-align: center;
  width: 160px;
  border-radius:15px;
  height: 24px;
  padding: 3px 20px 3px 20px;
  margin: 10px 0 0 0;
  font-size: 12px;
  color: #FFF;
}

.spusrname {
 display: block;
  padding: 5px 0 0 0;
  font-size: 2.0rem;
  font-weight: 800;
}

.spcompany {
  display: block;
  padding: 10px 0 0 0;
  font-size: 1.4rem;
  line-height: 1.8rem;
  font-weight: 800;
}

#spuserspbox {
  display: block;
  width: 100%;
  background-color: #eee;
  border-radius:7px;
  text-align: center;
  vertical-align: middle;
  padding: 5px 15px 5px 15px;
}