@charset "utf-8";

/* 共通
---------------------------------------------- */
/* clearfix */
.clearfix:after {
	content: ".";  /* 新しい要素を作る */
	display: block;  /* ブロックレベル要素に */
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix {
	min-height: 1px;
}
#line_lp a{
 color: #388bdb;}

* html .clearfix {
	height: 1px;
	/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}

/* PC 非表示 */
.pc_none {
	display:none;
}

/* スマホトップバナー　※PCでSPサイトを開いた場合 */
#spBnr {
	display:none;
}

/* パンくず */
#breadCrumb {
	width:980px;
	margin:0 auto 10px;
}
#breadCrumb ol li {
	display: inline_lp-block;
	font-size:12px;
	height:16px;
	padding:0 1em 0 2em;
	position:relative;
}
#breadCrumb ol li,#breadCrumb ol li a {
	line_lp-height:16px;
}
#breadCrumb ol li:first-of-type {
	background:url(/files/img/common/icon_home_01.png) no-repeat left center;
	padding-left:20px;
}
#breadCrumb ol li:not(:first-of-type)::before {
	content:'';
	display:block;
	width:1em;
	height:100%;
	background:url(https://unilife.co.jp/files/img/common/icon_arrow_03.png) no-repeat center center;
	position:absolute;
	left:0; bottom:0;
}


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

トップページ

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

/* 共通
---------------------------------------------- */


/* スマホトップバナー　※PCでSPサイトを開いた場合 */
/*#spBnr {
display:none;
}*/

/* ページTOP */
/*#page-top {
position: fixed;
bottom: 5px;
right: 20px;
}
#page-top a {
text-decoration: none;
width: 64px;
height: 88px;
display: block;
border-radius: 40px;
background-image: url(/event/taisyuku/img/pagetop.png);
text-indent: -999999px;
}
#gotop{
display: none;
}*/



/* 応募ボタンpc
---------------------------------- */
/*#line_lp .ctaOubo {
padding:60px 0;
text-align:center;
}
#line_lp .ctaOubo a {
display:block;
width:750px;
margin: 0 auto;
}*/

	
#line_lp .ctaOubo {
	padding: 30px 0 20px;
	margin-bottom: 40px;
	margin-top: 40px;
	text-align: center;
}
 #line_lp .ctaOubo ul {
width:900px;
margin:0 auto;
}
 #line_lp .ctaOubo ul li {
float:left;
}

 #line_lp .ctaOubo ul li a {
	display: block;
    text-decoration: none;
    padding: 20px;
    border-radius: 10px;
    background-position: 10px center;
    background-color: #4486bf;
    position: relative;
    color: #fff;
    font-weight: bold;
    font-size: 3em;
    text-align: center;
}
 #line_lp .ctaOubo ul li a small {
display:block;
font-size:70%;
}
 #line_lp .ctaOubo ul li a::after {
content:'';
display:block;
width:10px;
height:100%;
background:url(../img/arrow.png) no-repeat right center;
background-size:contain;
position:absolute;
right:10px; bottom:0;
}
 #line_lp .ctaOubo ul li a:hover,
 #line_lp .ctaOubo ul li a:active {
background-color:#2a5f8c;
}
 #line_lp .ctaOubo ul li a strong {
/*display:block;*/
font-size:1.6em;
font-weight:bold;
}

/* 3カラム */
 #line_lp .ctaOubo ul.col_3 li {
width:32%;
margin-right:1.3333%;
margin-bottom:10px;
}
 #line_lp .ctaOubo ul.col_3 li:nth-child(3n) {
margin-right:0;
}

/* 2カラム */
 #line_lp .ctaOubo ul.col_2 li {
width:49%;
margin-right:2%;
margin-bottom:10px;
}
 #line_lp .ctaOubo ul.col_2 li:nth-child(even) {
margin-right:0;
}

/* 1カラム */
 #line_lp .ctaOubo ul.col_1 li {
width:100%;
margin-right:0;
margin-bottom:10px;
 text-align: center;
}





/* ----------------------------------------------
プレゼント紹介
---------------------------------------------- */
/* キービジュアル */
#line_lp .keyV{
 /* background-image:url(/ssi/event/present_campaign/img/key_v_bg.png); */
 background-repeat:repeat-x;
 background-color: #06c655;
}
#line_lp .keyV::before {
	content: '';
	position: absolute;
    top: 300px;
    bottom: 0%;
    left: 0;
    right: 0;
}
#line_lp .keyV::after {
	content: '';
	position: absolute;
    top: 412px;
    bottom: 0%;
    left: 0;
    right: 0;
    z-index: -1;
}
#line_lp .keyV h1 {
	width: 1140px;
    margin: 0 auto;
    text-align: center;
}

/* 商品 */
#line_lp {/* background: url(/ssi/event/present_campaign/img/theme_bg.png) center top; *//* padding: 40px 0; */}
#line_lp .inner {
	width: 1140px;
	margin: 20px auto 0px;
	/* padding: 20px 0px 0px 0px; */
	background: #FFF;
}
#line_lp .inner ol {
	padding: 10px 10px 10px;
}
#line_lp ul {
	display:flex;
	flex-direction: row;
	flex-wrap:wrap;
	justify-content: space-evenly;
	align-content: space-between;
	justify-content: space-between;/* IE */
	/*background: url(/ssi/event/present_campaign/img/pg_bg.png);*/
}
#line_lp ul li {
width:25%;
padding:8px;
box-sizing:border-box;
}
#line_lp ul li:nth-child(-n+3) {
width:33.3%;
}
#line_lp ul li img {
max-width:100%;
}
#line_lp .gift {
text-align:center;
padding:20px 0;
}
#line_lp ol li {
font-size:0.8em;
}
#line_lp .title {
	width: 100%;
	background: #FFF;
	color: #06c655;
	font-size: 280%;
	font-weight: bold;
	text-align: center;
	margin: 25px auto;
}

/* QRコード
------------------------------- */
.relative {
  position: relative;
}
.absolute01 {
  position: absolute;
  left: 112px;
  bottom: 99px;
  width: 184px;
}
.absolute02{
  position: absolute;
  left: 21%;
  bottom: 31%;
  width: 262px;
}


/* ----------------------------------------------
応募要項
---------------------------------------------- */
#line_lp .entryGuideline_lps {
background: url(/ssi/event/present_campaign/img/shabby_chic.jpg);
padding:40px 0;
}
#line_lp .entryGuideline_lps .inner {
width:1000px;
margin:0 auto;
}
#line_lp .entryGuideline_lps h2 {
color:#544236;
text-align: center;
background:url(/ssi/event/present_campaign/img/titleline_lp.png) no-repeat center bottom;
padding:20px 0;
font-size:1.8em;
margin-bottom:0.5em;
}
#line_lp .entryGuideline_lps dl.item {
display:table;
width:100%;
border-bottom:#CCC solid 1px;
}
#line_lp .entryGuideline_lps dl:first-of-type {
border-top:#CCC solid 1px;
}
#line_lp .entryGuideline_lps dl.item dt,
#line_lp .entryGuideline_lps dl.item dd {
display:table-cell;
vertical-align:top;
padding:1em;
}
#line_lp .entryGuideline_lps dl.item dt {
background:#544236;
color:#FFF;
font-size:1.1em;
width:10em;
}
#line_lp .entryGuideline_lps dl.item dd {
background:#FFF;
color:#544236;
font-size:1.0em;
border-right:#CCC solid 1px;
}
#line_lp .entryGuideline_lps dl.item dd code {
display:inline_lp-block;
padding:0 0.5em;
margin:0 0.3em;
background:#eee;
}
#line_lp .entryGuideline_lps dl.item dd.kikan{
	color: #e7303b;
}
#line_lp .entryGuideline_lps dl.item dd.kikan span{
	font-size:130%;
	font-weight:900;
}
#line_lp .entryGuideline_lps dl.item ul li{
 display:block;
 margin:0 0 0.5em 0;
 padding-left:1.3em;
 background-image:url(/ssi/event/present_campaign/img/midashi.png);
 background-repeat:no-repeat;
 background-size:auto 0.8em;
 background-position:0 3px;
}



/* ----------------------------------------------
サービス紹介
---------------------------------------------- */
#line_lp .serviceIntro {
padding:40px 0;
}
#line_lp .serviceIntro .inner {
width:1000px;
margin:0 auto;
}
#line_lp .serviceIntro h3 {
color:#544236;
text-align: center;
background:url(/ssi/event/present_campaign/img/titleline_lp.png) no-repeat center bottom;
padding:20px 0;
font-size:1.8em;
margin-bottom:0.5em;
}
#line_lp .serviceIntro .serviceBox {
background-color: #ffdde0;
padding:12px 12px 0;
}
#line_lp .serviceIntro .serviceBox dl.mainBox {
background-color:#FFF;
display:table;
width:100%;
}
#line_lp .serviceIntro .serviceBox dl.mainBox dt,
#line_lp .serviceIntro .serviceBox dl.mainBox dd {
	display:table-cell;
	vertical-align: middle;
}
#line_lp .serviceIntro .serviceBox dl.mainBox dt {
width:51%;
}
#line_lp .serviceIntro .serviceBox dl.mainBox dd {
padding:20px 1em	;
}
#line_lp .serviceIntro .serviceBox dl.mainBox dd h4 {
color:#00bcd5;
font-weight:bold;
font-size:1.5em;
margin-bottom:0.5em;
}
#line_lp .serviceIntro .serviceBox dl.mainBox dd p {
	font-size:1.1em;
	text-align: justify;
}

/* バナー */
#line_lp .serviceIntro .serviceBox .subBox {
background:url(/ssi/event/present_campaign/img/staff.png) no-repeat left 20px bottom;
padding:20px 30px 20px 180px;
}
#line_lp .serviceIntro .serviceBox .subBox h4 {
color:#c53d43;
font-weight:bold;
background:url(/ssi/event/present_campaign/img/sakura.png) no-repeat left center;
padding-left:30px;
height:30px;
line_lp-height:30px;
margin-bottom:0.2em;
}
#line_lp .serviceIntro .serviceBox .subBox ul {
display:flex;
flex-direction: row;
flex-wrap:wrap;
justify-content: space-evenly;
align-content: space-between;
justify-content: space-between;/* IE */
}
#line_lp .serviceIntro .serviceBox .subBox ul li {
width:50%;
box-sizing:border-box;
padding:0 20px;
}
#line_lp .serviceIntro .serviceBox .subBox ul li img {
box-shadow:1px 1px 3px rgba(0,0,0,0.4);
/*transition:all ease-out 200ms;*/
}
#line_lp .serviceIntro .serviceBox .subBox ul li img:hover {
box-shadow:none;
margin:-1px 1px 1px -1px;
}

/* リンクボタン */
#line_lp .serviceIntro ul.serachNav {
display:table;
width:100%;
margin-top:40px;
}
#line_lp .serviceIntro ul.serachNav li {
display:table-cell;
width:33.3333%;
box-sizing:border-box;
padding:10px;
}
#line_lp .serviceIntro ul.serachNav li a {
display:block;
text-decoration:none;
height:60px;
display: flex;
align-items: center;/* 上下 */
justify-content: center;/* 左右 */
background: rgb(255,175,75);
background: line_lpar-gradient(to bottom,  rgba(255,175,75,1) 0%,rgba(255,146,10,1) 100%);
color:#FFF;
font-size:26px;
font-weight:bold;
border-radius:8px;
border:#ffaf4b solid 3px;
text-shadow: -1px -1px 0 rgba(255,146,10,1),
               1px -1px 0 rgba(255,146,10,1),
               -1px 1px 0 rgba(255,146,10,1),
               1px 1px 0 rgba(255,146,10,1);
}
#line_lp .serviceIntro ul.serachNav li a:hover {
background: rgb(255,175,75);
background: line_lpar-gradient(to bottom, rgba(255,146,10,1) 0%,rgba(255,175,75,1) 100%);
}

#line_lp .mainBox {
    margin-bottom: 0px;
    padding: 0;
    display: flex;
    justify-content: space-between;
    box-sizing: border-box;
}


/* クローズ */
.closed{
	width: 800px;
    display: block;
    margin: 0 auto;
    padding: 30px;
    background: #ffffff;
    position: absolute;
    top: unset;
    top: 280px;
 font-size:160%;
left: 10%;
    right: 10%;
    border-radius: 10px;
    border: #f54e96 1px solid;
}


/* エリア検索
------------------------------------------ */
.searchLinks h2{
	font-size: 250%;
    text-align: center;
    margin-top: 80px;
    position: relative;
    margin-bottom: 10px;
}
.searchLinks h2::after{
	margin-left: -16px;
    left: 50%;
    bottom: -10px;
    width: 32px;
    height: 2px;
    border-radius: 2px;
    background-color: #e95b00;
    content: "";
    position: absolute;
}

/* バナー
------------------------------------------ */

.bnr_01 {
    /*width: 1040px;*/
    margin: 12px auto;
    /*padding: 0 20px 0 30px;*/
}


/* トーク画面
------------------------------------------ */

/* styles.css */
.chat-bubble {
    display: grid;
    gap: 1em 0;
    padding: 30px 15px;
    background-color: #bbdaff;
}

.chat-bubble__section {
    display: flex;
    align-items: center;
    gap: 0 15px;
}

.chat-bubble__img {
    width: 7.7em;
    height: 7.7em;
    border-radius: 50%;
}

.chat-bubble__text {
    display: inline-block;
    position: relative;
    max-width: 80%;
    margin: 0;
    padding: .4em .8em;
    border-radius: 20px;
}

.chat-bubble__text.left {
    background-color: #fff;
    color: #06c655;
    font-size: 2.5em;
    font-weight: bold;
}

.chat-bubble__text.right {
    background-color: #30e852;
    margin: 0 10px 0 auto;
    color: #333;
    font-size: 1.5em;
}

.chat-bubble__text::before {
    position: absolute;
    top: -15px;
    width: 20px;
    height: 30px;
    content: '';
}

.chat-bubble__text.left::before {
    left: -10px;
    border-radius: 0 0 0 15px;
    box-shadow: -3px -15px 0 -7px white inset;
}

.chat-bubble__text.right::before {
    right: -10px;
    border-radius: 0 0 15px 0;
    box-shadow: 3px -15px 0 -7px #30e852 inset;
}