@charset "UTF-8";

/**
 *
 * Y!保険（ちょこっと保険） SP
 *
 * [modules]
 * [sections]
 *
 */


/* ==========================================================================
   modules
   ========================================================================== */


/*body*/

body, html {
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
}

body.modalClose {
  overflow: auto;
  height: 100%;
}

body.modalOpen {
  overflow: hidden;
}


/* contentTtl */

.contentTtl {
  height: 40px;
  line-height: 40px;
  padding: 0 10px;
  background-color: #7fc31c;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
  white-space: nowrap;
}

.contentTtlS {
  background-color: #ffb100;
}

.contentTtlM {
  background-color: #ff9000;
}

.contentTtlL {
  background-color: #ff7200;
}

.ttlIcon:before {
  display: inline-block;
  height: 30px;
  width: 30px;
  border-radius: 5px;
  line-height: 30px;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  color: #454545;
  margin-right: 5px;
  background-color: white;
}

.iconS:before {
  content: "S";
}

.iconM:before {
  content: "M";
}

.iconL:before {
  content: "L";
}

.contentTtlPc {
  background-color: #00a8d0;
}

.contentTtlOrange {
  background-color: #ffb100;
  color: #333;
  text-align: center;
}


/* ==========================================================================
   [sections]
   ========================================================================== */


/* choheader
   ========================================================================== */

.choheaderWrap {
  position: relative;
  height: 40px;
}

.choheaderTopTtl {
  position: absolute;
  top: 7.75px;
  left: 10px;
  width: 145px;
  height: 25px;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/choheaderTtl.png) no-repeat;
  background-size: 145px 25px;
  text-indent: -9999px;
}

.choheaderTtl {
  width: 145px;
  height: 25px;
  margin: 0 0 10px 10px;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/choheaderTtl.png) no-repeat;
  background-size: 145px 25px;
  text-indent: -9999px;
}

.choheaderTtl a {
  display: block;
  width: 145px;
  height: 25px;
}

.choheaderTtl_modal {
  display: block;
  position: relative;
  width: 100%;
  height: 25px;
  box-sizing: border-box;
  margin-bottom: 10px;
  padding-left: 10px;
  padding-right: 15px;
  background-position: 10px 0;
}


/* モーダルウィンドウの背景マスク */

.whatMask {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 1;
  background-color: rgba(0, 0, 0, 0.4);
  transition-property: opacity;
  transition-duration: 0.3s;
  z-index: 5000002;
}

.whatOpen {
  display: inline-block;
  position: absolute;
  right: 15px;
  bottom: -4px;
  font-size: 13px;
  font-weight: bold;
  color: #544A3F;
  text-decoration: underline;
}

.whatOpen:before {
  content: "";
  display: inline-block;
  position: relative;
  bottom: -2px;
  width: 15px;
  height: 15px;
  margin-right: 2px;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/icon_what.png) center / contain no-repeat;
}

.whatModal {
  display: block;
  position: absolute;
  top: 50px;
  left: 0;
  right: 0;
  width: 90%;
  max-width: 350px;
  color: #707070;
  border: 2px solid #BFE68A;
  border-radius: 10px;
  margin: 0 auto;
  padding-bottom: 18px;
  background-color: #fff;
  opacity: 1;
  z-index: 5000003;
  transition-property: opacity;
  transition-duration: 0.3s;
}

#mask.hidden {
  width: 0;
  height: 0;
  opacity: 0;
}

#modal.hidden {
  opacity: 0;
  transform: translate(0, -1000px)
}

.whatClose {
  width: 100%;
}

.whatClose a {
  display: block;
  position: relative;
  width: 45px;
  height: 45px;
  border-top-right-radius: 10px;
  margin-left: auto;
  margin-right: 0;
}

.whatClose a:active {
  background-color: rgba(0, 0, 0, 0.3);
}

.whatClose img {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.whatTtl img {
  display: block;
  margin: 0 auto;
}

.whatDes {
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
  margin-top: 15px;
}

.whatLabel {
  text-align: center;
}

.whatLabel p {
  display: inline-block;
  font-size: 12px;
  color: #fff;
  padding: 5px 15px;
  margin: 8px auto 0 auto;
  background-color: #908982;
}

.whatList {
  width: 260px;
  border-top: 1px solid rgba(112, 112, 112, 0.5);
  padding: 14px 0;
  margin: 14px auto 0;
}

.whatList li {
  display: flex;
  align-items: center;
  height: 37px;
  font-size: 20px;
  font-weight: bold;
  vertical-align: middle;
  padding: 1px;
  margin-right: auto;
  margin-left: auto;
  background-color: #7FC31D;
}

.whatList li:not(:first-of-type) {
  margin-top: 14px;
}

.whatGreen {
  display: block;
  width: 35px;
  height: 35px;
  flex-grow: 0;
  font-size: 10px;
  line-height: 10px;
  text-align: center;
  padding-top: 3px;
  color: #fff;
  background: #7FC31D;
}

.whatNum {
  display: block;
  width: 100%;
  font-size: 20px;
  line-height: 25px;
  font-weight: bold;
}

.whatTxt {
  display: block;
  height: 35px;
  flex-grow: 1;
  font-size: 16px;
  line-height: 35px;
  padding-left: 10px;
  background-color: #fff;
}

.modalLink {
  width: 260px;
  margin: 0 auto;
  text-align: right;
}

.modalLink a {
  font-size: 14px;
  text-decoration: underline;
  color: #707070;
}

.modalLink:after {
  content: "";
  display: inline-block;
  position: relative;
  top: 2px;
  width: 14px;
  height: 14px;
  margin-left: 2px;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/newTab.png) center/contain no-repeat;
}

.choheaderMenu {
  display: inline-block;
  position: absolute;
  right: 10px;
  font-weight: bold;
  font-size: 14px;
  line-height: 1.1em;
}

.choheaderMenuBtn {
  display: table-cell;
  height: 35px;
  padding: 7px 10px 0px 10px;
  vertical-align: middle;
}

.choheaderCaption {
  margin-left: 10px;
  width: 300px;
  height: 111px;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/choheaderCaption.png) no-repeat;
  background-size: 300px 111px;
  text-indent: -9999px;
}

.choheaderDesc {
  width: 320px;
  margin: 0 auto 10px;
  background-repeat: no-repeat;
  text-indent: -9999px;
}

.choheaderDescYama {
  height: 310px;
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/choheaderDescYama.png);
  background-size: 320px 310px;
}

.choheaderDescSports {
  height: 325px;
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/choheaderDescSports.png);
  background-size: 320px 325px;
}

.choheaderDescSki {
  height: 335px;
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/choheaderDescSki.png);
  background-size: 320px 335px;
}

.choheaderDescGolf {
  height: 290px;
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/choheaderDescGolf.png);
  background-size: 320px 290px;
}

.choheaderDescCycle {
  height: 290px;
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/choheaderDescCycle.png);
  background-size: 320px 290px;
}

.choheaderDescBaisyo {
  height: 393px;
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/choheaderDescBaisyo.png);
  background-size: 320px 393px;
}

.choheaderNotes {
  font-size: 12px;
  padding: 0 10px 0 30px;
  margin-bottom: 10px;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/icon_cho.png) no-repeat 10px 50%;
  background-size: 15px 15px;
}

.choheaderNotesFeature {
  color: #7fc31c;
  font-size: 14px;
}

.choheaderNav {
  width: 299px;
  margin: 0 auto;
}

.choheaderNavItm {
  float: left;
  line-height: 1.3;
  width: 93px;
  margin-right: 10px;
  font-weight: bold;
}

.choheaderNavItm:last-child {
  margin-right: 0;
}

.choheaderNavItmBtn {
  padding: 5px 0;
}


/* plansnav
   ========================================================================== */

.plansnav {
  -moz-box-shadow: rgba(53, 89, 0, 0.2) 0 5px 5px 0;
  -webkit-box-shadow: rgba(53, 89, 0, 0.2) 0 5px 5px 0;
  box-shadow: rgba(53, 89, 0, 0.2) 0 5px 5px 0;
}

.plansnavDetail {
  -moz-box-shadow: 0 0 0;
  -webkit-box-shadow: 0 0 0;
  box-shadow: 0 0 0;
}

.plansnavItm {
  min-height: 68px;
  padding-right: 10px;
  border-bottom: 1px solid #7fc31c;
  background-repeat: no-repeat;
  background-position: 10px 50%;
  background-size: 70px 52px;
}

.plansnavItmSnow {
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/plansnavItmSnow.png);
}

.plansnavItmCycle {
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/plansnavItmCycle.png);
}

.plansnavItmBaisyo {
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/plansnavItmBaisyo.png);
}

.plansnavItmGolf {
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/plansnavItmGolf.png);
}

.plansnavItmSports {
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/plansnavItmSports.png);
}

.plansnavItmYama {
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/plansnavItmYama.png);
}

.plansnavItmDomestic {
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/plansnavItmDomestic.png);
}

.plansnavLink {
  color: #333;
}

.plansnavItmDef {
  line-height: 1.5;
  padding: 8px 10px 8px 90px;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/sign_orange.png) 100% 50% no-repeat;
  background-size: 7px 12px;
  color: #333;
}

.plansnavItmDesc {
  font-size: 12px;
}

.plansnavItmTerm {
  font-weight: bold;
  font-size: 15px;
}

.plansnavNotes {
  line-height: 1.5;
  width: 210px;
  margin: 5px 0 0 auto;
  padding: 0 10px;
  text-align: right;
}


/* featurenav
   ========================================================================== */

.featurenavItm {
  border-bottom: 1px solid #7fc31c;
  padding-right: 10px;
  font-weight: bold;
}

.featurenavItmLink {
  display: block;
  padding: 15px 10px;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/sign_green.png) 100% 50% no-repeat;
  background-size: 7px 12px;
  color: #333;
}

.featurenavMenu {
  margin: 10px 0;
  font-weight: bold;
  font-size: 18px;
}

.featurenavMenuBtn {
  padding: 14px;
}

.featurenavTxt {
  line-height: 1.5;
  margin-bottom: 10px;
  font-size: 12px;
}

.featurenavNotes {
  font-size: 10px;
}


/* admsteps
   ========================================================================== */

.admstepsTtl {
  width: 276px;
  height: 17px;
  margin: 15px auto;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/admstepsTtl.png) no-repeat;
  background-size: 276px 17px;
  text-indent: -9999px;
}

.admstepsFlowDef {
  display: table;
  width: 100%;
  margin-bottom: 10px;
  border: 2px solid #00a8d0;
  border-radius: 5px;
  background-color: #00a8d0;
  font-weight: bold;
  font-size: 14px;
}

.admstepsFlowTerm {
  display: table-cell;
  width: 28%;
  padding: 14px 0 14px 10px;
  border-radius: 3px 0 0 3px;
  background-color: #fff;
  color: #00a8d0;
}

.admstepsFlowDesc {
  display: table-cell;
  width: 72%;
  padding: 14px 0 14px 10px;
  color: #fff;
}

.admstepsFlowRegWrap {
  padding: 0 5px;
}

.admstepsFlowReg {
  width: 100%;
  margin: 10px 0 20px;
}

.admstepsFlowRegItm {
  float: left;
  width: 50%;
  font-weight: bold;
}

.admstepsFlowRegItmInnerL {
  padding-right: 5px;
}

.admstepsFlowRegItmInnerR {
  padding-left: 5px;
}

.admstepsFlowRegItmBtn {
  padding: 15px 10px;
}

.admstepsFlowTxt {
  line-height: 1.5;
  margin-bottom: 20px;
  padding: 0 10px;
  font-size: 14px;
}


/* planlist
   ========================================================================== */

.planlistBody {
  width: 100%;
  line-height: 1.5;
  margin: 10px 0 5px;
  border-spacing: 0;
  font-size: 12px;
  text-align: center;
}

.planlistElm {
  padding: 5px;
  border-top: 1px solid #333;
  border-left: 1px solid #333;
}

.planlistElmR {
  padding: 5px;
  border-top: 1px solid #333;
  border-right: 1px solid #333;
  border-left: 1px solid #333;
}

.planlistElmB {
  padding: 5px;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  border-left: 1px solid #333;
}

.planlistElmTh {
  padding: 5px;
  border-top: 1px solid #333;
  border-left: 1px solid #333;
  background-color: #7FC31C;
}

.planlistElmTl {
  padding: 5px;
  border-top: 1px solid #333;
  border-left: 1px solid #333;
  border-top-left-radius: 5px;
  background-color: #7FC31C;
}

.planlistElmTr {
  padding: 5px;
  border-top: 1px solid #333;
  border-right: 1px solid #333;
  border-left: 1px solid #333;
  border-top-right-radius: 5px;
  background-color: #7FC31C;
}

.planlistElmBl {
  width: 1em;
  line-height: 1.1;
  padding: 5px;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  border-left: 1px solid #333;
  border-bottom-left-radius: 5px;
  background-color: #7FC31C;
}

.planlistElmBr {
  padding: 1em;
  border: 1px solid #333;
  border-bottom-right-radius: 5px;
}

.planlistDef {
  text-align: left;
}

.planlistTerm {
  margin-bottom: 5px;
  font-weight: bold;
}

.planlistDesc {
  font-size: 13px;
  font-weight: bold;
}

.planlistNotes {
  line-height: 1.5;
  margin-bottom: 10px;
  color: #ff7e00;
  font-size: 12px;
}

.planlistApply {
  font-weight: bold;
  font-size: 18px;
}

.planlistApply2 {
  font-weight: bold;
  font-size: 18px;
  padding-bottom: 20px;
}

.planlistApplyBtn {
  padding: 10px;
}

.planlistApplyBtn2 {
  display: flex;
  align-items: center;
  width: 270px;
  height: 62px;
  border-radius: 10px;
  font-feature-settings: "pkna";
  padding: 10px 0 10px 10px;
  margin: 0 auto;
}

.planlistApplyBtn p {
  font-size: 10px;
  font-weight: normal;
  margin-top: 2px;
}

.planlistApplyBtn2 p {
  display: block;
  font-size: 10px;
}

.planlistApplyBtn2 span {
  display: block;
  flex-grow: 1;
  height: 100%;
  text-align: center;
  padding-top: 10px;
}

.planlistTxtS {
  color: #444;
  line-height: 1.3em;
  margin-top: 2px;
}

.btnIcon:before {
  display: inline-block;
  flex-grow: 0;
  height: 48px;
  width: 48px;
  border-radius: 10px;
  line-height: 48px;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  color: #454545;
  vertical-align: middle;
  background-color: white;
}

.planlistSteps {
  margin-top: 20px;
}

.planlistStepsItm {
  margin-bottom: 15px;
  font-weight: bold;
  font-size: 18px;
}

.planlistStepsItmBtn {
  padding: 10px;
}


/* bsyCoverage
   ========================================================================== */

.bsyCoverageBody {
  width: 100%;
  line-height: 1.5;
  margin: 10px 0;
  border-spacing: 0;
  font-size: 14px;
  text-align: center;
}

.bsyCoverageElm {
  padding: 5px;
  border-top: 1px solid #333;
  border-left: 1px solid #333;
}

.bsyCoverageElmR {
  padding: 5px;
  border-top: 1px solid #333;
  border-right: 1px solid #333;
  border-left: 1px solid #333;
}

.bsyCoverageElmB {
  padding: 5px;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  border-left: 1px solid #333;
}

.bsyCoverageElmT {
  padding: 5px;
  border-top: 1px solid #333;
  border-left: 1px solid #333;
  background-color: #FFB100;
  font-size: 12px;
}

.bsyCoverageElmTl {
  padding: 5px;
  border-top: 1px solid #333;
  border-left: 1px solid #333;
  border-top-left-radius: 5px;
  background-color: #FFB100;
  font-size: 12px;
}

.bsyCoverageElmTr {
  padding: 5px;
  border-top: 1px solid #333;
  border-right: 1px solid #333;
  border-left: 1px solid #333;
  border-top-right-radius: 5px;
  background-color: #FFB100;
  font-size: 12px;
}

.bsyCoverageElmBl {
  padding: 5px;
  border-top: 1px solid #333;
  border-bottom: 1px solid #333;
  border-left: 1px solid #333;
  border-bottom-left-radius: 5px;
}

.bsyCoverageElmBr {
  padding: 5px;
  border: 1px solid #333;
  border-bottom-right-radius: 5px;
  color: #E80000;
}

.bsyCoverageDef {
  text-align: left;
}

.bsyCoverageTerm {
  font-weight: bold;
  font-size: 12px;
}

.bsyCoverageDesc {
  font-size: 10px;
}

.bsyCoverageCaution {
  line-height: 1.5;
  margin: 20px 0 15px;
  color: #e80000;
  font-weight: bold;
  font-size: 12px;
}

.bsyCoverageCautionTerm {
  float: left;
  padding-left: 20px;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/bsyCoverageCautionTerm.png) no-repeat 0 50%;
  background-size: 13px 12px;
}

.bsyCoverageCautionDesc {
  padding-left: 70px;
}

.bsyCoverageExpl {
  line-height: 1.5;
  padding-left: 1.8em;
  font-size: 12px;
}

.bsyCoverageExplItm {
  text-indent: -1.8em;
}


/* bsyCase
   ========================================================================== */

.bsyCaseBody {
  line-height: 1.5;
  margin: 10px 0;
  padding: 10px;
  border-radius: 5px;
  background-color: #E5E5E5;
  font-size: 12px;
}

.bsyCaseBodyTxt {
  margin-bottom: 10px;
}

.bsyCaseBodyTxt:last-child {
  margin-bottom: 0;
}

.bsyCaseOrder {
  width: 283px;
  height: 154px;
  margin: 0 auto;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/bsyCaseOrder.png) no-repeat;
  background-size: 283px 154px;
  text-indent: -9999px;
}

.bsyCaseTxt {
  line-height: 1.5;
  margin: 10px 0;
  font-size: 12px;
  text-align: center;
}


/* pageFeature common
   ========================================================================== */

.contentTtlMerit {
  padding-left: 40px;
  background-image: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/contentTtlMerit.png);
  background-repeat: no-repeat;
  background-size: 20px;
  font-size: 14px;
}

.contentTtlMerit1 {
  background-position: 10px 10px;
}

.contentTtlMerit2 {
  background-position: 10px -60px;
}

.contentTtlMerit3 {
  background-position: 10px -130px;
}

.contentTtlMerit4 {
  background-position: 10px -200px;
}

.pageFeatureTxt {
  line-height: 1.5;
  margin: 10px 0;
  font-size: 14px;
}

.pageFeatureTxtNotes {
  line-height: 1.5;
  font-size: 10px;
}


/* supportsrv
   ========================================================================== */

.inssupportBody {
  line-height: 1.5;
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 5px;
  background-color: #ffe490;
  font-size: 14px;
}

.inssupportItm {
  list-style: disc;
  margin-left: 20px;
}


/* inssummary
   ========================================================================== */

.insummaryBody {
  line-height: 1.5;
  border: 1px solid #9fc93a;
  border-radius: 5px;
  background-color: #fffddb;
  font-size: 12px;
}

.insummaryTerm, .insummaryDesc {
  padding: 3px 5px;
}

.insummaryTerm {
  font-weight: bold;
  background-color: #9fc93a;
}

.insummaryInner {
  margin: 4px 2px;
  padding: 10px;
  border-radius: 5px;
  background-color: #ffe490;
}


/* insentry
   ========================================================================== */

.insentryBody {
  line-height: 1.5;
  padding: 10px;
  border-radius: 5px;
  background-color: #ffe490;
  font-size: 12px;
}


/* insPcver
   ========================================================================== */

.insPcver {
  line-height: 1.5;
  font-size: 14px;
}

.insPcverDesc {
  margin-bottom: 10px;
}


/* inschargeFlow
   ========================================================================== */

.inschargeFlow {
  width: 300px;
  height: 377px;
  margin: 0 auto;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/inschargeFlow.png) no-repeat;
  background-size: 300px 377px;
  text-indent: -9999px;
}


/* contentFooter
   ========================================================================== */


/* warranty */

.warranty {
  margin-bottom: 20px;
  border: 1px solid #333;
  border-radius: 5px;
}

.warrantyTtl {
  height: 30px;
  line-height: 30px;
  padding: 0 12px;
  border-radius: 5px 5px 0 0;
  background-color: #eee;
  font-size: 12px;
}

.warrantyTxt {
  line-height: 1.5;
  padding: 12px;
  font-size: 10px;
}


/* agents */

.agents {
  line-height: 1.5;
  margin-bottom: 10px;
  padding: 12px 10px;
  background-color: #eee;
  border-radius: 5px;
  font-size: 12px;
}

.agentsTerm, .agentsDesc {
  float: left;
}

.agentsTerm {
  clear: both;
}

.agentsTerm:after {
  content: '：';
}

.choAsset {
  margin-bottom: 20px;
  font-size: 10px;
  text-align: right;
}

.choLink {
  margin-bottom: 10px;
  font-size: 14px;
  text-align: center;
}

.choCopy {
  font-size: 12px;
  text-align: center;
}

.cyokohoAttention {
  border: 2px solid #E22F2F;
  font-weight: bold;
  color: #E22F2F;
  padding: 5px;
  margin: 10px;
}

.bnrArea {
  text-align: center;
}

.cyokohoInfo {
  display: block;
  margin: 5px 10px;
  border: 1px solid #FAD382;
  background: #FFF48E;
  border-radius: 1px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  color: #153552;
  font-size: 13px;
  font-weight: bold;
  overflow: hidden;
  box-shadow: 0px 0px 2px #FAD382;
  -webkit-box-shadow: 0 0 2px #FAD382;
  -moz-box-shadow: 0 0 2px #FAD382;
}

.cyokohoInfo li {
  padding: 5px;
}

.cyokohoInfo li:last-child {
  border-bottom: none;
}

.cyokohoInfo a {
  display: inline-block;
  position: relative;
}


/* 20170728 */

.trialPlan {}

.trialPlan p {
  padding: 10px 10px 0px;
}

.trialPlan a {
  margin: 0 10px;
}

.trialPlan a span {
  display: block;
}


/*--------- campaignList -------------------*/

.yjMainGrid {
  padding: 20px 10px;
  background: #f7f7f8;
}

.cpList h2 {
  border-left: 5px solid #1756c1;
  padding-left: 6px;
  margin: 0 0 15px 0;
  line-height: 1.4;
}

.cpList h2.insMainTtl {
  font-size: 18px;
  font-weight: bold;
  color: #393939;
}

.cpList ul li a:link {
  display: block;
}

.cpList ul li a:hover {
  background: #f5faff;
}

.cpList ul li {
  border: 1px solid #d9d9d9;
  border-radius: 3px;
  margin-bottom: 15px;
  background: #FFF;
}

.cpList ul li dl {
  padding: 10px;
}

.cpList ul li p.more {
  text-align: center;
  display: block;
  padding-top: 10px;
}

.cpList ul li p.more span {
  color: #0068b7;
  font-size: 13px;
  font-weight: bold;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/campaign/list/icon_arrow.png) no-repeat right;
  background-size: 7px 11px;
  padding-right: 13px;
  display: table;
  margin: auto;
}

.cpList .listTopArea .cpList .listImg {
  max-width: 620px;
  display: block;
  margin: auto;
}

.cpList .listImg img {
  width: 100%;
}

.cpList .listTopArea .category {
  padding-bottom: 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-pack: justify
}

.cpList .listTopArea p.co {
  font-size: 10px;
  color: #555;
  text-align: right;
  padding-top: 5px;
}

.cpList .listTopArea .iconEvent {
  padding: 2px 0;
  border: 1px solid #7392ac;
  margin-bottom: 10px;
}

.cpList .listTopArea .iconEvent span {
  color: #7392ac;
  font-size: 12px;
  line-height: 1.8;
  display: block;
  text-align: center;
}

.cpList .listHeader {
  padding: 10px 0;
}

.cpList .listHeader h3.listTitle {
  color: #555;
  font-size: 16px;
  font-weight: bold;
  line-height: 25px;
  text-align: left;
}

.cpList .listCaption {
  padding: 10px 0 0 0;
}

.cpList .listCaption h3.caption {
  color: #000;
  font-size: 14px;
  text-align: left;
  line-height: 20px;
}

.cpList .listDetail p.period {
  background: #f7f7f8;
  padding: 10px 0;
  padding-bottom: 10px;
}

.cpList .listDetail p.period span {
  font-size: 12px;
  color: #444;
  display: block;
  text-align: center;
}


/*----------- MonthRanking -------------------*/

#monthrnk span.small {
  font-size: 10px;
  color: #1d2837;
  line-height: 15px;
  display: block;
  margin-bottom: 10px;
}

.ttlRnkHeader {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-pack: justify;
  border-bottom: 2px solid #017eba;
}

.ttlRnkHeader a {
  font-weight: bold;
  font-size: 13px;
}

.ranking .insSubTtl {
  color: #1e2936;
  font-weight: bold;
  font-size: 15px;
}

.ranking .listArea {
  padding: 15px 15px 0;
  border: 1px solid #d9d9d9;
  border-radius: 3px;
  background-color: #FFF;
  margin-bottom: 15px;
}

.ranking ol li {
  border-bottom: 1px solid #e1e0df;
}

.ranking .listArea ol li dl {
  padding-left: 40px;
}

.ranking ol li:after {
  content: "";
  display: block;
  clear: both;
}

.ranking ol li:last-child {
  border: none;
}

.ranking ol li dl dt {
  font-weight: bold;
  color: #0068b7;
  font-size: 13px;
}

.ranking ol li dl dd {
  font-size: 12px;
  color: #555555;
}

.ranking ol li span.number {
  margin-top: 5px;
  text-indent: -9999px;
  display: block;
  width: 24px;
  float: left;
  height: 23px;
  line-height: 1.5em;
  color: #ffffff;
  font-weight: bold;
}

.ranking ol li a {
  padding-bottom: 10px;
  padding-top: 10px;
}

.ranking ol li a:link {
  display: block;
}

.ranking ol li a:hover {
  background: #f5faff;
}

.ranking ol li.no1 span.number {
  background: url(https://assets.paypay-insurance.co.jp/chokotto/images/common/iconRank1.png);
}

.ranking ol li.no2 span.number {
  background: url(https://assets.paypay-insurance.co.jp/chokotto/images/common/iconRank2.png);
}

.ranking ol li.no3 span.number {
  background: url(https://assets.paypay-insurance.co.jp/chokotto/images/common/iconRank3.png);
}


/*--------------- Category ------------------*/

.cpList .iconCp {
  font-weight: bold;
  padding: 4px 5px;
  min-width: 69px;
  text-align: center;
  display: block;
  font-size: 82%;
}

.cpList .iconNew {
  color: #0068b7;
  border: 1px solid #0068b7;
  background: #FFF;
}

.cpList .iconSoon {
  color: #ff7608;
  border: 1px solid #ff7608;
  background: #FFF;
}

.cpList .iconSkin {
  padding: 5px 10px;
  color: #ffffff;
  font-size: 82%;
  display: block;
  text-align: center;
  border-radius: 3px;
}

.cpList .iconSkin.iconDeath {
  background-color: #ff3c78;
}

.cpList .iconSkin.iconSick {
  background-color: #ff2020;
}

.cpList .iconSkin.iconFuture {
  background-color: #78bb00;
}

.cpList .iconSkin.iconAccident {
  background-color: #1b32a9;
}

.cpList .iconSkin.iconHome {
  background-color: #ff5b15;
}

.cpList .iconSkin.iconTravel {
  background-color: #ffb000;
}

.cpList .iconSkin.iconSports {
  background-color: #187700;
}

.cpList .iconSkin.iconPet {
  background-color: #843207;
}

.cpList .iconSkin.iconOther {
  background-color: #a86cc4;
}


/*alert_monday*/

.alert_monday {
  margin: 10px;
  padding: 10px;
  border: 1px #ff0000 solid;
  text-align: center;
}

.alert_monday h2 {
  font-weight: bold;
  font-size: 17px;
}

.alert_monday p {
  line-height: 1.5;
  padding: 7px 0 0;
  font-size: 14px;
}

.alert_monday b {
  display: block;
  margin-top: 5px;
  font-size: 15px;
}


/*--------------- notice ------------------*/

.noticeArea {
  padding: 0 10px;
}

.noticeBox {
  padding: 10px;
  border: 2px solid #ffb4b4;
  background: #fff0f0;
  font-weight: bold;
  font-size: 14px;
  text-align: left;
  color: #ff1818;
}

.noticeBox a {
  text-decoration: underline;
}


/*renewal*/

.headerElm {
  margin: 30px 0 0px 0;
}

.contentCase1 {
  margin-top: -10px;
  padding-bottom: 10px;
}

.choheaderNotes2 {
  font-size: 16px;
  font-weight: bold;
  color: #6a9b3c;
  padding: 0 10px 0 20px;
  margin-bottom: 7px;
  background: url(https://assets.paypay-insurance.co.jp/chokotto/smp/images/icon_cho.png) no-repeat 0px 50%;
  background-size: 15px 15px;
}

.planNav {
  width: 299px;
  margin: 20px auto 20px;
}

.planlist {
  padding: 10px 0px 0px 0px;
}

.planBtnTtl {
  font-size: 19px;
  font-weight: bold;
  color: #6a9b3c;
  text-align: center;
  margin-bottom: 5px;
}

.btnIconS:before {
  display: inline-block;
  margin: 0 0 0 8px;
  flex-grow: 0;
  height: 48px;
  width: 48px;
  border-radius: 5px;
  line-height: 48px;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  color: #ffb100;
  vertical-align: middle;
  background-color: white;
}

.planlistApplyBtnS {
  display: flex;
  align-items: center;
  width: 270px;
  height: 62px;
  border-radius: 5px;
  font-feature-settings: "pkna";
  padding: 10px 0 10px 10px;
  margin: 15px auto 0;
  box-shadow: #ff7e00 0 5px;
  background: #ffb100;
}

.btnIconM:before {
  display: inline-block;
  margin: 0 0 0 8px;
  flex-grow: 0;
  height: 48px;
  width: 48px;
  border-radius: 5px;
  line-height: 48px;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  color: #ff9000;
  vertical-align: middle;
  background-color: white;
}

.planlistApplyBtnM {
  display: flex;
  align-items: center;
  width: 270px;
  height: 62px;
  border-radius: 5px;
  font-feature-settings: "pkna";
  padding: 10px 0 10px 10px;
  margin: 15px auto 0;
  box-shadow: #e94d00 0 5px;
  background: #ff9000;
}

.btnIconL:before {
  display: inline-block;
  margin: 0 0 0 8px;
  flex-grow: 0;
  height: 48px;
  width: 48px;
  border-radius: 5px;
  line-height: 48px;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  color: #ff7200;
  vertical-align: middle;
  background-color: white;
}

.planlistApplyBtnL {
  display: flex;
  align-items: center;
  width: 270px;
  height: 62px;
  border-radius: 5px;
  font-feature-settings: "pkna";
  padding: 10px 0 10px 10px;
  margin: 15px auto 0;
  box-shadow: #ea4d00 0 5px;
  background: #ff7200;
}

.btnTxt {
  display: block;
  padding: 0px 0px 0px 25px;
  font-size: 20px!important;
  line-height: 25px;
}

.planlistTxt {
  padding: 0 10px;
  line-height: 1.5;
  margin-bottom: 10px;
  color: #888888;
  font-size: 12px;
}


/*サポートサービス*/

.supportBox {
  margin-top: 30px;
  padding: 0 0 10px;
  background-color: #f3f9ea;
}

.supportTxt {
  margin: 10px auto;
  padding: 0;
  color: #6a9b3c;
  font-size: 16px;
  font-weight: bold;
}

.supportList {
  display: -webkit-flex;
  display: flex;
  margin: 0 auto 7px;
  padding: 0;
  font-size: 14px;
  color: #544a3f;
}

.supportListItm {
  width: 48%;
  margin-right: 0;
  margin-bottom: 8px;
  padding: 5px 0;
  border-radius: 5px;
  background-color: #fff;
}

.supportListItm:first-child {
  margin-right: 13px;
}

.supportList img {
  margin: 0 auto;
  text-align: center;
}

.supportList .icon {
  margin: 5px 0;
  text-align: center;
}

.supportTtl {
  padding: 10px;
  background-color: #7fc31c;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
}

.walletBox {
  padding: 5px 0 12px;
  background-color: #e6faff;
}

.walletTtl {
  margin: 8px auto;
  padding: 0 10px 5px;
  color: #00a8d0;
  font-size: 20px;
  font-weight: bold;
}

.walletTxt {
  margin: 8px auto;
  padding: 0 10px 5px;
  color: #544a3f;
  font-size: 18px;
  font-weight: bold;
}


/*Btn*/

.insBtnGreen {
  -moz-box-shadow: #628a39 0 5px;
  -webkit-box-shadow: #628a39 0 5px;
  box-shadow: #628a39 0 5px;
  background: #7fc31c;
}

.insBtnBlue_s {
  width: 270px;
  margin: 0 auto;
  -moz-box-shadow: #00748f 0 5px;
  -webkit-box-shadow: #00748f 0 5px;
  box-shadow: #00748f 0 5px;
  background: #00a8d0;
}