@charset "utf-8";

/****************************************

Main

*****************************************/

#main {
  width: 100%;
  margin: 25px 0;
}
/* main_slide */
#main_slide {
  width: 70%;
  float: left;
}
#main_slide .fade { width: 100%; height: auto; margin: 0 auto 25px; padding: 0; }
#main_slide .fade img{ width: 100%; }
/* main_banner */
#main_banner {
  width: 30%;
  float: right;
}
#main_banner .vertical { width: 100%; height: auto; margin: 0 auto 25px; }
#main_banner .vertical div { width: 100%; line-height: 0; text-align: center; }
#main_banner .vertical div img { width: 100%; }
#main_banner .vertical .slick-prev { left: calc(50% - 10px); top: 2%; transform: rotateZ(90deg); z-index: 100; }
#main_banner .vertical .slick-next { right: calc(50% - 10px); top: 95%; transform: rotateZ(90deg); z-index: 100; }
@media screen and (min-width:769px) {
}
@media screen and (max-width:768px) {
    #main {
      width: 100%;
      margin: 0px;
    }
    #main_slide {
      width: calc(100% - 0px);
    }
    #main_slide button {
      display: none;
    }
    #main_banner {
      width: calc(100% - 30px);
      padding: 0 15px;
    }
}


/****************************************

navi

*****************************************/

@media screen and (min-width:769px) {
    #navTppField {
      display:none;
    }
}
@media screen and (max-width:768px) {
    #navTppField {
      width:100%;
      margin-top: 55px;
    }
    #navTppField ul {
    }
    #navTppField ul li {
      padding:10px;
      border-bottom:1px solid #cccccc;
      background:#eeeeee url(../images/ico_mark.png) no-repeat right;
    }
    #navTppField ul li a {
      width:100%;
      color:#333333;
      display:block;
    }
    #navTppField div {
      border-top:1px solid #242424;
      background:#234165;
    }
    #navTppField p {
      width:50%;
      text-align:center;
      border-top:1px solid #777777;
      background:#5f5f5f;
      float:left;
    }
    #navTppField p a {
      padding:10px 0;
      color:#ffffff;
      border-left:1px solid #777777;
      border-right:1px solid #242424;
      display:block;
    }
}

/****************************************

Slider

*****************************************/
.slider {
	margin: 0 0 50px;
}
.slider img {
	width: 100%;
	height: auto;
}
.single-item {
	max-width: 600px;
	margin: 0 auto 50px;
}
.slick-prev::before, .slick-next::before {
	font-size: 24px;
}
.lazy-item .slick-next,
.thumb-item-nav .slick-next,
.multiple-item .slick-next,
.center-item .slick-next {
	right: 20px;
	z-index: 99;
}
.lazy-item .slick-prev,
.thumb-item-nav .slick-prev,
.multiple-item .slick-prev,
.center-item .slick-prev {
	left: 15px;
	z-index: 100;
}
.single-item .slick-prev::before,
.single-item .slick-next::before {
	color: #666;
}
.slick-dots {
	bottom:-25px;
}
.multiple-item li {
	margin: 0 5px;
}
.thumb-item {
	max-width: 1000px;
	margin: 0 auto 5px;
	padding: 0 5px;
}
.thumb-item-nav {
	max-width: 1000px;
	margin: 0 auto 20px;
}
.thumb-item-nav img {
	max-width: 100%;
}
.thumb-item-nav li{
	margin: 5px;
}
.lazy-item {
	width: 400px;
	margin: 0 auto 50px;
}
.lazy-item li {
	margin: 0 5px;
}
@media screen and (max-width:768px) {
    .thumb-item {
      max-width: 100%;
      margin: 65px 0 0;
    }
    .thumb-item img {
      width: 100%;
      height: auto;
    }
    .thumb-item-nav {
      max-width: 100%;
    }
}

/****************************************

Contents

*****************************************/

#contents {
  width:100%;
  line-height:1.8em;
}
.contentsField {
  width:1000px;
  margin:0 auto;
}
.contentsArea {
  width:100%;
}
.contentsBox {
  width:100%;
  background:#234165;
}
@media screen and (max-width:768px) {
    .contentsField {
      width:100%;
      margin:0 auto;
    }
}


/*-----------------------------------
各学部
-----------------------------------*/

.contentsCheck .block_gakubu li{
	padding: 15px;
	box-sizing: border-box;
	background: #FCFCFC;
}
@media screen and (max-width:768px) {
	.contentsCheck .block_gakubu li{
		width: calc(100% - 15px);
		margin: 0 auto 5px;
	}
	.contentsCheck .block_gakubu li:first-child {
     margin: 0 auto 5px;
   }
}

.contentsCheck .block_gakubu li.bg_pink{
	border-top: 10px solid #E2B7BE;
	border-right: 1px solid #E2B7BE;
	border-left: 1px solid #E2B7BE;
	border-bottom: 1px solid #E2B7BE;
}
.contentsCheck .block_gakubu li.bg_green{
	border-top: 10px solid #7CB389;
	border-right: 1px solid #7CB389;
	border-left: 1px solid #7CB389;
	border-bottom: 1px solid #7CB389;
}
.contentsCheck .block_gakubu li.bg_blue{
	border-top: 10px solid #B8C2DB;
	border-right: 1px solid #B8C2DB;
	border-left: 1px solid #B8C2DB;
	border-bottom: 1px solid #B8C2DB;
}
.contentsCheck .block_gakubu li dt {
	text-align: center;
	font-size: 23px;
	padding-bottom: 8px;
}
.contentsCheck .block_gakubu li.bg_pink dt {
	border-bottom: 1px solid #F9A3B0;
	color: #F9A3B0;
}
.contentsCheck .block_gakubu li.bg_pink dt span{
	color: #B784B7;
	font-size: 85%;
}
.contentsCheck .block_gakubu li.bg_green dt {
	border-bottom: 1px solid #7CB389;
	color: #7CB389;
}
.contentsCheck .block_gakubu li.bg_blue dt {
	border-bottom: 1px solid #B8C2DB;
	color: #B8C2DB;
}
.contentsCheck .block_gakubu li dd{
	padding: 15px 10px 0 10px;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
}
.contentsCheck .block_gakubu li dd a{
	display: block;
	width: 50%;
	color: #000;
	font-size: 16px;
	padding: 3px 0;
}
.contentsCheck .block_gakubu li dd a:hover{
	opacity: 0.7;
}
.contentsCheck .block_gakubu li dd a.w100 {
	width: 100%;
}
.contentsCheck .block_gakubu li dd a:before{
	content: '▶';
	font-size: 80%;
	margin-right: 7px;
}
.contentsCheck .block_gakubu li.bg_pink dd a:before{
	color: #E2B7BE;
}
.contentsCheck .block_gakubu li.bg_pink dd .josan:before{
	color: #B784B7;
}
.contentsCheck .block_gakubu li.bg_green dd a:before{
	color: #7CB389;
}
.contentsCheck .block_gakubu li.bg_blue dd a:before{
	color: #B8C2DB;
}

/*-----------------------------------
contentsCheck
-----------------------------------*/
.contentsCheck {
  width:1000px;
  margin:20px auto 0;
}
.contentsCheck ul li {
  width: 320px;
  margin: 0 0 20px 20px;
  float: left;
}
.contentsCheck ul li:first-child {
  margin: 0 0 20px 0px;
}
@media screen and (max-width:768px) {
    .contentsCheck {
      width:auto;
      margin:20px 0 0 15px;
    }
    .contentsCheck ul li {
      width: calc(33% - 10px);
      margin: 0 0 20px 10px;
      float: left;
    }
    .contentsCheck ul li:first-child {
      margin: 0 0 20px 0px;
    }
    .contentsCheck ul li img {
      width: 100%;
      height: auto;
    }
}
@media screen and (max-width:468px) {
    #check_other {
      width:auto;
      margin:20px 0 0 0;
    }
    #check_other li {
      width: calc(100% - 15px);
      margin: 0 0 5px;
    }
    #check_other li:first-child {
      margin: 0 0 5px;
    }
    #check_other li img {
      width: 100%;
      height: auto;
    }
}

/*-----------------------------------
contentsBnr
-----------------------------------*/
.contentsBnr {
  width:1000px;
  margin:25px auto 0;
}
.bnrBox {
  width: 280px;
  margin: 0 0 0 20px;
  padding: 20px 20px;
  color: #FFFFFF;
  background: #234165 url(../../common/images/ico_arrow.png) no-repeat 261px 21px;
  float: left;
}
.bnrBox:first-child {
  margin: 0 0 0 0px;
}
.bnrBox a {
  color: #FFFFFF;
  line-height: 1.3em;
  display: block;
}
.bnrBox .title {
  font-size: 20px;
  font-weight: bold;
}
.bnrBox .text {
  margin: 10px 0 0;
  padding: 10px 0 0;
  font-size: 14px;
  border-top: 1px dotted #5a718c;
  display: block;
}
@media screen and (max-width:768px) {
    .contentsBnr {
      width:100%;
      margin:20px auto;
    }
    .bnrBox {
      width: auto;
      margin: 10px 20px 0;
      padding: 20px 20px;
      color: #FFFFFF;
      float: none;
      background: #234165 url(../../common/images/ico_arrow.png) no-repeat 221px 21px;
    }
    .bnrBox:first-child {
      margin: 10px 20px 0;
    }
}

/*-----------------------------------
contentsTab
-----------------------------------*/
.contentsTab {
  width:1000px;
  margin:25px auto 0;
}
.contentsTab h3 {
  margin: 0 0 20px;
  color:#234165;
  font-size:25px;
}

.tab{overflow:hidden;}
.tab li{width:100px; padding:10px 25px; float:left; margin-right:1px; text-align: center; cursor: pointer; background:#EEEEEE;}
.tab li:hover{border-bottom:5px solid #234165;}
.tab li.select{margin-top:0px; border-bottom:5px solid #234165; background:#EEEEEE;}
.content li{margin-top:0px; padding:20px 20px 0px; background:#F5F5F5;}
.hide {display:none;}

.tabBox {
  width: 203px;
  margin: 0 20px 20px 0;
  padding: 10px;
  border: 1px solid #CCCCCC;
  background: #FFFFFF;
  float: left;
  position: relative;
}
.tabBox:after {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	border-left: 20px solid transparent;
	content: "";
}
.news:after { border-top: 20px solid #234165; }
.event:after { border-top: 20px solid #235596; }
.topics:after { border-top: 20px solid #0c5ec9; }
.research:after { border-top: 20px solid #0091b0; }
.tabBox:nth-child(4n) {
  margin: 0 0px 20px 0;
}
.tabBox .data {
  color: #555555;
  font-size: 85%;
}
.tabBox .text {
  line-height: 1.5em;
}
.tabBox .text a {
  color: #333333;
}
.tabBox .cate {
  width: auto;
  margin: 5px 0 0;
  text-align: center;
}
.tabBox .cate a {
  width: auto;
  color: #FFFFFF;
  display: block;
}
.news .cate { background: #234165; }
.event .cate { background: #235596; }
.topics .cate { background: #0c5ec9; }
.research .cate { background: #0091b0; }
.content li .btn {
  width: 100%;
  margin:  0 0 20px;
  text-align: center;
  float: left;
}
.content li .btn a {
  width:100%;
  padding: 5px 0;
  color: #FFFFFF;
  border: 1px solid #EEEEEE;
  background: #333333;
  display: block;
}
@media screen and (max-width:768px) {
    .contentsTab {
      width:100%;
      margin:10px auto 0;
    }
    .contentsTab h3 {
      text-align: center;
    }

    .tab{}
    .tab li{width:auto; padding: 10px 11px;}
    .tab li:hover{}
    .tab li.select{}
    .content li{}
    .hide {display:none;}
    
    .tabBox {
      width: auto;
      margin: 0 0px 20px 0;
      padding: 10px;
      float: none;
    }
    .tabBox .text {
      height: auto;
      display: block;
    }
}
@media screen and (max-width:440px) {
    .tab li{ font-size: 12px; padding: 10px 5px; }
}

/*-----------------------------------
contentsPickup
-----------------------------------*/
.contentsPickup {
  width:1000px;
  margin:50px auto 0;
}
.contentsPickup h3 {
  margin: 0 0 20px;
  color:#234165;
  font-size:25px;
}
.contentsPickup .pickupBox {
  width: 490px;
  margin: 0 20px 20px 0;
  float: left;
}
.contentsPickup .pickupBox:nth-child(2n) {
  margin: 0 0px 20px 0;
}
.contentsPickup .pickupBox .img {
  width: 180px;
  height: 200px;
  text-align: center;
  overflow: hidden;
  background: #CCCCCC;
  float: left;
}
.contentsPickup .pickupBox .img img {
  width: auto;
  height: 100%;
}
.contentsPickup .pickupBox .title {
  width: 280px;
  height: 47px;
  font-weight: bold;
  line-height: 1.5em;
  overflow: hidden;
  float: right;
}
.contentsPickup .pickupBox .text {
  width: 280px;
  height: 80px;
  margin: 14px 0;
  font-size: 14px;
  line-height: 1.4em;
  overflow: hidden;
  float: right;
}
.contentsPickup .pickupBox .btn {
  width: 280px;
  height: 45px;
  float: right;
}
.contentsPickup .pickupBox .btn a {
  padding: 10px 0;
  color: #FFFFFF;
  text-align: center;
  border-radius: 20px;
  background: #234165;
  display: block;
}
@media screen and (max-width:768px) {
    .contentsPickup {
      width:100%;
      margin:10px auto 0;
    }
    .contentsPickup h3 {
      text-align: center;
    }
    .contentsPickup .pickupBox {
      width: 100%;
      margin: 0 0px 20px 0;
      float: none;
    }
    .contentsPickup .pickupBox:nth-child(2n) {
      margin: 0 0px 20px 0;
    }
    .contentsPickup .pickupBox .img {
      width: 100%;
      float: none;
    }
    .contentsPickup .pickupBox .title {
      width: auto;
      height: auto;
      padding: 20px;
      float: none;
    }
    .contentsPickup .pickupBox .text {
      width: auto;
      height: auto;
      margin: 0px 0;
      padding: 0 20px 20px;
      float: none;
    }
    .contentsPickup .pickupBox .btn {
      width: auto;
      height: auto;
      padding: 0 20px 0;
      float: none;
    }
}

/*-----------------------------------
informationField
-----------------------------------*/
#informationField {
  width:100%;
  max-width:1000px;
  margin:50px auto 0;
}
#informationField p {
  padding:20px;
  border:5px solid #a04545;
  background:#fff0ed;
}
@media screen and (max-width:768px) {
    #informationField {
      width:95%;
      margin:0px auto;
    }
}

/*-----------------------------------
newsField
-----------------------------------*/
#newsField {
  margin:50px 0 0;
}
#newsField h3 {
  padding:0 0 0 30px;
  font-size:20px;
  font-weight:bold;
  background:url(../images/ico_news.gif) no-repeat;
}
#newsField h3 span {
  font-size:15px;
  float:right;
}
#newsField h3 span a {
  color:#555555;
}
#newsField ul li {
  width:235px;
  margin:20px 0 0 20px;
  float:left;
}
#newsField ul li:first-child {
  margin:20px 0 0 0px;
}
#newsField ul li span {
  display:block;
}
#newsField ul li a {
  color:#333333;
  display:block;
}
#newsField ul li a:hover {
  opacity:0.8;
  filter: alpha(opacity=80 style=0);
  -moz-opacity:0.8;
}
#newsField .newsBox {
  width:235px;
  margin:20px 0 0 20px;
  float:left;
}
#newsField .newsBox:first-child {
  margin:20px 0 0 0px;
}
#newsField .newsBox a {
  color:#333333;
  display:block;
}
#newsField .newsBox a:hover {
  opacity:0.8;
  filter: alpha(opacity=80 style=0);
  -moz-opacity:0.8;
}
#newsField .newsBox .data {
  margin:10px 0 0;
}
@media screen and (max-width:768px) {
    #newsField {
      width:95%;
      margin:25px auto 0;
    }
    #newsField ul li {
      width:100%;
      margin:20px 0 20px 0px;
      padding:0 0 20px 0;
      line-height:1.0em;
      border-bottom:1px dotted #CCCCCC;
      float:none;
    }
    #newsField ul li:first-child {
      margin:20px 0 20px 0px;
    }
    #newsField .newsBox {
      width:100%;
      margin:20px 0 20px 0px;
      padding:0 0 20px 0;
      line-height:1.0em;
      border-bottom:1px dotted #CCCCCC;
      float:none;
    }
    #newsField .newsBox:first-child {
      margin:20px 0 20px 0px;
    }
}

/*-----------------------------------
eventField
-----------------------------------*/
#eventField {
  margin:50px 0 0;
}
#eventField h3 {
  padding:0 0 0 30px;
  font-size:20px;
  font-weight:bold;
  background:url(../images/ico_event.gif) no-repeat;
}
#eventField h3 span {
  font-size:15px;
  float:right;
}
#eventField h3 span a {
  color:#555555;
}
#eventField ul li {
  width:235px;
  margin:20px 0 0 20px;
  float:left;
}
#eventField ul li:first-child {
  margin:20px 0 0 0px;
}
#eventField ul li span {
  display:block;
}
#eventField ul li a {
  color:#333333;
  display:block;
}
#eventField ul li a:hover {
  opacity:0.8;
  filter: alpha(opacity=80 style=0);
  -moz-opacity:0.8;
}
#eventField .eventBox {
  width:235px;
  margin:20px 0 0 20px;
  float:left;
}
#eventField .eventBox:first-child {
  margin:20px 0 0 0px;
}
#eventField .eventBox a {
  color:#333333;
  display:block;
}
#eventField .eventBox a:hover {
  opacity:0.8;
  filter: alpha(opacity=80 style=0);
  -moz-opacity:0.8;
}
#eventField .eventBox .data {
  margin:10px 0 0;
}
@media screen and (max-width:768px) {
    #eventField {
      width:95%;
      margin:25px auto 0;
    }
    #eventField ul li {
      width:100%;
      margin:20px 0 20px 0px;
      padding:0 0 20px 0;
      line-height:1.0em;
      border-bottom:1px dotted #CCCCCC;
      float:none;
    }
    #eventField ul li:first-child {
      margin:20px 0 20px 0px;
    }
    #eventField .eventBox {
      width:100%;
      margin:20px 0 20px 0px;
      padding:0 0 20px 0;
      line-height:1.0em;
      border-bottom:1px dotted #CCCCCC;
      float:none;
    }
    #eventField .eventBox:first-child {
      margin:20px 0 20px 0px;
    }
}

/*-----------------------------------
topicsField
-----------------------------------*/
#topicsField {
  margin:50px 0 0;
}
#topicsField h3 {
  padding:0 0 0 30px;
  font-size:20px;
  font-weight:bold;
  background:url(../images/ico_topics.gif) no-repeat;
}
#topicsField h3 span {
  font-size:15px;
  float:right;
}
#topicsField h3 span a {
  color:#555555;
}
#topicsField ul li {
  width:235px;
  margin:20px 0 0 20px;
  float:left;
}
#topicsField ul li:first-child {
  margin:20px 0 0 0px;
}
#topicsField ul li span {
  display:block;
}
#topicsField ul li a {
  color:#333333;
  display:block;
}
#topicsField ul li a:hover {
  opacity:0.8;
  filter: alpha(opacity=80 style=0);
  -moz-opacity:0.8;
}
#topicsField .topicsBox {
  width:235px;
  margin:20px 0 0 20px;
  float:left;
}
#topicsField .topicsBox:first-child {
  margin:20px 0 0 0px;
}
#topicsField .topicsBox a {
  color:#333333;
  display:block;
}
#topicsField .topicsBox a:hover {
  opacity:0.8;
  filter: alpha(opacity=80 style=0);
  -moz-opacity:0.8;
}
#topicsField .topicsBox .data {
  margin:10px 0 0;
}
@media screen and (max-width:768px) {
    #topicsField {
      width:95%;
      margin:25px auto 0;
    }
    #topicsField ul li {
      width:100%;
      margin:20px 0 20px 0px;
      padding:0 0 20px 0;
      line-height:1.0em;
      border-bottom:1px dotted #CCCCCC;
      float:none;
    }
    #topicsField ul li:first-child {
      margin:20px 0 20px 0px;
    }
    #topicsField .topicsBox {
      width:100%;
      margin:20px 0 20px 0px;
      padding:0 0 20px 0;
      line-height:1.0em;
      border-bottom:1px dotted #CCCCCC;
      float:none;
    }
    #topicsField .topicsBox:first-child {
      margin:20px 0 20px 0px;
    }
}

/*-----------------------------------
researchField
-----------------------------------*/
#researchField {
  margin:50px 0 0;
}
#researchField h3 {
  padding:0 0 0 30px;
  font-size:20px;
  font-weight:bold;
  background:url(../images/ico_research.gif) no-repeat;
}
#researchField h3 span {
  font-size:15px;
  float:right;
}
#researchField h3 span a {
  color:#555555;
}
#researchField ul li {
  width:235px;
  margin:20px 0 0 20px;
  float:left;
}
#researchField ul li:first-child {
  margin:20px 0 0 0px;
}
#researchField ul li span {
  display:block;
}
#researchField ul li a {
  color:#333333;
  display:block;
}
#researchField ul li a:hover {
  opacity:0.8;
  filter: alpha(opacity=80 style=0);
  -moz-opacity:0.8;
}
#researchField .researchBox {
  width:235px;
  margin:20px 0 0 20px;
  float:left;
}
#researchField .researchBox:first-child {
  margin:20px 0 0 0px;
}
#researchField .researchBox a {
  color:#333333;
  display:block;
}
#researchField .researchBox a:hover {
  opacity:0.8;
  filter: alpha(opacity=80 style=0);
  -moz-opacity:0.8;
}
#researchField .researchBox .data {
  margin:10px 0 0;
}
@media screen and (max-width:768px) {
    #researchField {
      width:95%;
      margin:25px auto 0;
    }
    #researchField ul li {
      width:100%;
      margin:20px 0 20px 0px;
      padding:0 0 20px 0;
      line-height:1.0em;
      border-bottom:1px dotted #CCCCCC;
      float:none;
    }
    #researchField ul li:first-child {
      margin:20px 0 20px 0px;
    }
    #researchField .researchBox {
      width:100%;
      margin:20px 0 20px 0px;
      padding:0 0 20px 0;
      line-height:1.0em;
      border-bottom:1px dotted #CCCCCC;
      float:none;
    }
    #researchField .researchBox:first-child {
      margin:20px 0 20px 0px;
    }
}

/*-----------------------------------
snsField
-----------------------------------*/
#snsField {
  width: 1080px;
  margin:50px auto 0;
  border-top:1px solid #e5e5e5;
  border-bottom:1px solid #e5e5e5;
}
#snsField ul li {
  width:140px;
  height:50px;
  padding:10px;
  margin:10px 0 10px 5px;
  border:1px solid #e5e5e5;
  font-size:15px;
  float:left;
}
#snsField ul li a {
  padding:15px 0 0 60px;
  color:#333333;
  display:block;
}
#snsField ul li a:hover {
  opacity:0.8;
  filter: alpha(opacity=80 style=0);
  -moz-opacity:0.8;
}
#snsField ul li.blog {
  width:200px;
  background:#EEEEEE url(../images/ico_blog.gif) no-repeat 10px 10px;
}
#snsField ul li.columm {
  width:200px;
  background:#EEEEEE url(../images/ico_columm.gif) no-repeat 10px 10px;
}
#snsField ul li.mailmagazine {
  background:url(../images/ico_mailmagazine.gif) no-repeat 10px 10px;
}
#snsField ul li.media {
  width:200px;
  padding:0px 10px 20px;
  line-height:1.4em;
  background:url(../images/ico_media.gif) no-repeat 10px 10px;
}
#snsField ul li.icon {
  width:50px;
  height:50px;
  padding:10px;
  margin:10px 0 10px 5px;
  border:1px solid #e5e5e5;
  font-size:15px;
  float:left;
}
#snsField ul li.icon a {
  padding:0px 0 0 0px;
  color:#333333;
  display:block;
}
#snsField ul li.bnr01 {
  width:320px;
  height: 100px;
  padding:0px;
  margin:0 0 0 5px;
  border:none;
  float:left;
}
#snsField ul li.bnr01 a {
  width:320px;
  height: 100px;
  padding:0px;
}
#snsField ul li.bnr01 img {
  width:100%;
  height:100%;
}
#snsField ul li.bnr02 {
  width:244px;
  height: 100px;
  padding:0px;
  margin:0 0 0 5px;
  border:none;
  float:left;
}
#snsField ul li.bnr02 a {
  width:244px;
  height: 100px;
  padding:0px;
}
#snsField ul li.bnr02 img {
  width:100%;
  height:100%;
}
/*
#snsField ul li.twitter {
  background:url(../images/ico_twitter.gif) no-repeat 10px 10px;
}
#snsField ul li.facebook {
  background:url(../images/ico_facebook.gif) no-repeat 10px 10px;
}
#snsField ul li.line {
  background:url(../images/ico_line.gif) no-repeat 10px 10px;
}
*/
.balloonText a {
  color:#FFFFFF;
  font-size:15px;
  line-height:1.5em;
  text-decoration:none;
}
.balloonText a:hover  {
  text-decoration:underline;
}
@media screen and (max-width:768px) {
    #snsField {
      width:auto;
      margin:25px 0 0;
      border-top:none;
      border-bottom:none;
    }
    #snsField ul li {
      margin:10px auto;
    }
    #snsField ul li a {
    padding:15px 0 0 55px;
    }
    #snsField ul li.blog {
      width: calc( 50% - 25px ) ;
      margin-left: 4px;
    }
    #snsField ul li.columm {
      width: calc( 50% - 25px ) ;
    }
    #snsField ul li.mailmagazine {
      width: calc( 50% - 25px ) ;
      margin-left: 4px;
    }
    #snsField ul li.media {
      width: calc( 100% - 25px ) ;
    }
    #snsField ul li.icon {
      width: calc( 20% - 20px ) ;
      height: auto;
      margin: 10px 0 10px 5px;
      padding: 5px;
    }
    #snsField ul li img {
      width:100%;
      height: auto;
    }
    #snsField ul li.bnr01 {
      width: calc( 50% - 5px ) ;
      height: 80px;
      margin: 0 0 10px 5px;
    }
    #snsField ul li.bnr01 a {
      width:100%;
      height: 80px;
    }
    #snsField ul li.bnr02 {
      width: calc( 50% - 5px ) ;
      height: 80px;
      margin: 0 0 10px 5px;
    }
    #snsField ul li.bnr02 a {
      width:100%;
      height: 80px;
    }
}

/*-----------------------------------
pickupField
-----------------------------------*/
#pickupField {
  width:1000px;
  margin:0 auto;
  padding:0 0 50px;
  color:#FFFFFF;
}
#pickupField .pickupBox {
  margin:50px 0 0;
  padding:50px 0 0;
  border-top:1px dotted #788799;
}
#pickupField .pickupBox h3 {
  font-size:25px;
}
#pickupField .pickupBox h3 span {
  font-size:15px;
  float:right;
}
#pickupField .pickupBox h3 a {
  color:#FFFFFF;
}
#snsField ul li a:hover {
  opacity:0.8;
  filter: alpha(opacity=80 style=0);
  -moz-opacity:0.8;
}
#pickupField .pickupBox p {
  margin:20px 0 0;
}
@media screen and (max-width:768px) {
    #pickupField {
      width:100%;
    }
    #pickupField .pickupBox {
      width:95%;
      margin:25px auto 0;
      padding:25px 0 0;
    }
}

/*-----------------------------------
bannerField
-----------------------------------*/
@media screen and (min-width:769px) {
#bannerField {
  margin:50px auto 0;
  border-top:1px solid #e5e5e5;
  border-bottom:1px solid #e5e5e5;
  background:#F5F5F5;
  display:block;
}
#bannerFieldSP {
  display:none;
}
}
@media screen and (max-width:768px) {
#bannerField {
   display:none;
}
#bannerFieldSP {
  margin:35px auto 0;
  padding:10px 0 0;
  border-top:1px solid #e5e5e5;
  border-bottom:1px solid #e5e5e5;
  background:#F5F5F5;
  display:block;
}
#bannerFieldSP ul {
}
#bannerFieldSP ul li {
  text-align:center;
}
#bannerFieldSP .button {
  padding:5px 0;
  color:#FFFFFF;
  text-align:center;
  background:#234165;
}
}